cartodb/torque
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

caches isolines, improves performance

Browse Source
This commit is contained in:
Francisco Dans 2015-08-20 12:37:55 +02:00
parent c920293d65
commit 472daa6ffa
2 changed files with 17 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
lib/torque/leaflet/torque.js
View File

@ -229,7 +229,6 @@ L.TorqueLayer = L.CanvasLayer.extend({
}
this.renderer.tileDimensions = {w: min.w.size, h: min.h.size};
this.renderer.firstTileCoords = {coord: this._tiles[min.k].coord, pos:this.getTilePos(this._tiles[min.k].coord)};
ctx.setTransform(1, 0, 0, 1, this.renderer.firstTileCoords.pos.x, this.renderer.firstTileCoords.pos.y);
var valsPerTile = 256/this.options.resolution;
this.renderer.globalGrid = Array.apply(null, Array(this.renderer.tileDimensions.h * valsPerTile)).map(Number.prototype.valueOf,0);
@ -250,13 +249,17 @@ L.TorqueLayer = L.CanvasLayer.extend({
if (tile._tileCache) {
// when the tile has a cached image just render it and avoid to render
// all the points
//this.renderer._ctx.drawImage(tile._tileCache, 0, 0);
ctx.setTransform(1, 0, 0, 1, pos.x, pos.y);
this.renderer._ctx.drawImage(tile._tileCache, 0, 0);
} else {
ctx.setTransform(1, 0, 0, 1, this.renderer.firstTileCoords.pos.x, this.renderer.firstTileCoords.pos.y);
this.renderer.renderTile(tile, this.key, pos);
}
}
}
this.renderer.applyFilters();
if (!tile._tileCache){
this.renderer.applyFilters();
}
}
// prepare caches if the animation is not running

84
lib/torque/renderer/point.js
View File

@ -5,6 +5,7 @@ var carto = global.carto || require('carto');
var Filters = require('./torque_filters');
var d3 = require('d3');
var contour = require('./contour');
var cSpline = require('cardinal-spline');
var TAU = Math.PI * 2;
var DEFAULT_CARTOCSS = [
@ -200,14 +201,6 @@ var contour = require('./contour');
*/
var isolines = true;
if (isolines) {
function getRandomColor() {
var letters = '0123456789ABCDEF'.split('');
var color = '#';
for (var i = 0; i < 6; i++ ) {
color += letters[Math.floor(Math.random() * 16)];
}
return color;
}
this._gridData(tile);
}
prof.end(true);
@ -215,15 +208,18 @@ var contour = require('./contour');
_gridData: function(tile){
var valsPerTile = this.TILE_SIZE/this.options.resolution;
var difX = tile.coord.x - this.firstTileCoords.coord.x;
var difY = tile.coord.y - this.firstTileCoords.coord.y;
if (difX < 0 || difY < 0) return;
// baseIndex is the distance to the upper left corner of the grid, in cells
var baseIndex = {
x: (tile.coord.x - this.firstTileCoords.coord.x) * valsPerTile,
y: (tile.coord.y - this.firstTileCoords.coord.y) * valsPerTile
x: (difX) * valsPerTile,
y: (difY) * valsPerTile
}
for(var i = 0; i < tile.renderData.length; i++){
var x = tile.x[i], y = tile.y[i];
this.globalGrid[baseIndex.y + (256 - y)/this.options.resolution-1][baseIndex.x + x/this.options.resolution] = tile.renderData[i];
this.globalGrid[baseIndex.y + (256 - y) / this.options.resolution -1][baseIndex.x + x/this.options.resolution] = tile.renderData[i];
}
},
@ -236,27 +232,18 @@ var contour = require('./contour');
}).join("");
var type = parseInt(parsedCell, 2);
var interpolated = true;
var N = interpolated?[this._lerp(cell[1], cell[0], contour), 0]: [0.5,0],
S = interpolated?[this._lerp(cell[2], cell[3], contour), 1]: [0.5,1],
E = interpolated?[1, this._lerp(cell[2], cell[1], contour)]: [1,0.5],
W = interpolated?[0, this._lerp(cell[3], cell[0], contour)]: [0,0.5]
// Blank
var N = interpolated? [this._lerp(cell[1], cell[0], contour), 0]: [0.5,0],
S = interpolated? [this._lerp(cell[2], cell[3], contour), 1]: [0.5,1],
E = interpolated? [1, this._lerp(cell[2], cell[1], contour)]: [1,0.5],
W = interpolated? [0, this._lerp(cell[3], cell[0], contour)]: [0,0.5]
if (type === 0 || type === 15) return null;
// W - S
if (type === 1 || type === 14) return [W, S]
// S - E
if (type === 2 || type === 13) return [S, E]
// W - E
if (type === 3 || type === 12) return [W, E]
// N - E
if (type === 4 || type === 11) return [N, E]
// N - S
if (type === 6 || type === 9) return [N, S]
// W - N
if (type === 7 || type === 8) return [W, N]
// W - N / S - E
if (type === 5) return [W, N, S, E]
// W - S / N - E
if (type === 10) return [W, S, N, E]
},
@ -387,55 +374,6 @@ var contour = require('./contour');
}
},
drawIsolines: function(){
if (this.globalGrid.length > 0) {
var style = this._shader.getLayers()[1].getStyle({}, {zoom: 2});
var cellsY = this.globalGrid.length-1;
var contourValues = [0, 4, 8, 16, 32, 64, 128];
var ctx = this._ctx;
var res = this.options.resolution;
var startPos = this.firstTileCoords.pos;
ctx.strokeStyle = style["-isoline-line-color"] || "black";
ctx.lineWidth = style["-isoline-line-width"] || 2;
ctx.globalAlpha = style["-isoline-line-opacity"] || 0.8;
var grad = style["-isoline-line-ramp"] && this._generateGradient(style["-isoline-line-ramp"].args);
for (var c = 0; c < contourValues.length; c++) {
if(style["-isoline-line-decay"]){
var max = contourValues[contourValues.length - 1];
ctx.globalAlpha = (contourValues[c]/max)*(style["-isoline-line-opacity"] || 0.8);
}
if(grad){
ctx.strokeStyle = "rgb("+grad[4*contourValues[c]+1]+","+grad[4*contourValues[c]+2]+","+grad[4*contourValues[c]+3]+")";
}
for (var y = 0; y < cellsY; y++) {
for (var x = 0; x < this.globalGrid[y].length-1; x++){
var currentCell = [
this.globalGrid[y][x],
this.globalGrid[y][x+1],
this.globalGrid[y+1][x+1],
this.globalGrid[y+1][x]
];
var pipe = this._getPipe(currentCell, contourValues[c]);
if (pipe){
ctx.beginPath();
ctx.moveTo(res * (x + 0.5 + pipe[0][0]), res * (y + 0.5 + pipe[0][1]));
ctx.lineTo(res * (x + 0.5 + pipe[1][0]), res * (y + 0.5 + pipe[1][1]));
ctx.stroke();
if (pipe.length === 4){
ctx.beginPath();
ctx.moveTo(res * (x + 0.5 + pipe[2][0]), res * (y + 0.5 + pipe[2][1]));
ctx.lineTo(res * (x + 0.5 + pipe[3][0]), res * (y + 0.5 + pipe[3][1]));
ctx.stroke();
}
}
}
}
}
ctx.globalAlpha = 0;
}
},
_generateGradient: function(ramp){
var gradientCanvas = this._createCanvas(),
gctx = gradientCanvas.getContext('2d'),