calculates grid globally

This commit is contained in:
Francisco Dans 2015-08-19 09:02:14 +02:00
parent 42b4f4a645
commit 3f6d0d9671

View File

@ -61,6 +61,7 @@ var contour = require('./contour');
this._gradients = {};
this._forcePoints = false;
this.globalGrid = [];
}
torque.extend(PointRenderer.prototype, torque.Event, {
@ -175,6 +176,9 @@ var contour = require('./contour');
// renders all the layers (and frames for each layer) from cartocss
//
renderTile: function(tile, key, pos) {
if(tile && !this.firstTileCoords){
this.firstTileCoords = tile.coord;
}
if (this._iconsToLoad > 0) {
this.on('allIconsLoaded', function() {
this.renderTile.apply(this, [tile, key, callback]);
@ -287,30 +291,6 @@ var contour = require('./contour');
// ctx.fill();
// }
// }
var cellsX = grid[0].length-1;
var cellsY = grid.length-1;
var contourValues = [0, 4, 8, 16];
ctx.strokeStyle = "white";
for(var c = 0; c < contourValues.length; c++){
for (var y = 0; y < cellsY; y++){
for (var x = 0; x < cellsX; x++){
var currentCell = [grid[y][x], grid[y][x+1], grid[y+1][x+1], grid[y+1][x]];
var pipe = this._getPipe(currentCell, contourValues[c]);
if (pipe){
ctx.beginPath();
ctx.moveTo(x * res + anchor + res * pipe[0][0], y * res + anchor + res * pipe[0][1]);
ctx.lineTo(x * res + anchor + res * pipe[1][0], y * res + anchor + res * pipe[1][1]);
ctx.stroke();
if (pipe.length === 4){
ctx.beginPath();
ctx.moveTo(x * res + anchor + res * pipe[2][0], y * res + anchor + res * pipe[2][1]);
ctx.lineTo(x * res + anchor + res * pipe[3][0], y * res + anchor + res * pipe[3][1]);
ctx.stroke();
}
}
}
}
}
}
// var pixelIndex = tile.timeIndex[key];
@ -334,21 +314,23 @@ var contour = require('./contour');
},
_gridData: function(tile){
var res = this.options.resolution;
var grid = new Array(256/res);
for(var i =0; i<grid.length; i ++){
grid[i] = new Array(256/res);
for(var j =0; j < grid[i].length; j++){
grid[i][j] = 0;
}
var valsPerTile = this.TILE_SIZE/this.options.resolution;
var baseIndex = {
x: (tile.coord.x - this.firstTileCoords.x) * valsPerTile,
y: (tile.coord.y - this.firstTileCoords.y) * valsPerTile
}
if(!this.globalGrid){
this.globalGrid = [];
}
// to do invert
for(var i =0; i < tile.renderData.length; i++){
var x = tile.x[i], y = tile.y[i];
grid[y/res][x/res] = tile.renderData[i];
if(!this.globalGrid[baseIndex.y + y/this.options.resolution]){
this.globalGrid[baseIndex.y + y/this.options.resolution] = [];
}
this.globalGrid[baseIndex.y + y/this.options.resolution][baseIndex.y + x/this.options.resolution] = tile.renderData[i];
}
return grid.reverse(); // Torque tiles have an inverted y axis!
},
_getPipe: function(cell, contour){
@ -512,43 +494,78 @@ var contour = require('./contour');
},
applyFilters: function(){
if(this._style){
if(this._style['image-filters']){
function gradientKey(imf){
var hash = ""
for(var i = 0; i < imf.args.length; i++){
var rgb = imf.args[i].rgb;
hash += rgb[0] + ":" + rgb[1] + ":" + rgb[2];
}
return hash;
if(this.globalGrid.length > 0){
for (var i = 0, c = 0; i < this.globalGrid.length; i++){
if (this.globalGrid[i] && this.globalGrid[i].length > c){
c = this.globalGrid[i].length;
}
var gradient = this._gradients[gradientKey(this._style['image-filters'])];
if(!gradient){
function componentToHex(c) {
var hex = c.toString(16);
return hex.length == 1 ? "0" + hex : hex;
}
var cellsY = this.globalGrid.length-1;
var contourValues = [0, 4, 8, 16];
var ctx = this._ctx;
var res = this.options.resolution;
var anchor = this.options.resolution/2;
ctx.strokeStyle = "white";
for(var c = 0; c < contourValues.length; c++){
for (var y = 0; y < cellsY; y++){
if(this.globalGrid[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(x * res + anchor + res * pipe[0][0], y * res + anchor + res * pipe[0][1]);
ctx.lineTo(x * res + anchor + res * pipe[1][0], y * res + anchor + res * pipe[1][1]);
ctx.stroke();
if (pipe.length === 4){
ctx.beginPath();
ctx.moveTo(x * res + anchor + res * pipe[2][0], y * res + anchor + res * pipe[2][1]);
ctx.lineTo(x * res + anchor + res * pipe[3][0], y * res + anchor + res * pipe[3][1]);
ctx.stroke();
}
}
}
}
function rgbToHex(r, g, b) {
return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
}
gradient = {};
var colorize = this._style['image-filters'].args;
var increment = 1/colorize.length;
for (var i = 0; i < colorize.length; i++){
var key = increment * i + increment;
var rgb = colorize[i].rgb;
var formattedColor = rgbToHex(rgb[0], rgb[1], rgb[2]);
gradient[key] = formattedColor;
}
this._gradients[gradientKey(this._style['image-filters'])] = gradient;
}
this._filters.gradient(gradient);
this._filters.draw();
}
}
}
// if(this._style){
// if(this._style['image-filters']){
// function gradientKey(imf){
// var hash = ""
// for(var i = 0; i < imf.args.length; i++){
// var rgb = imf.args[i].rgb;
// hash += rgb[0] + ":" + rgb[1] + ":" + rgb[2];
// }
// return hash;
// }
// var gradient = this._gradients[gradientKey(this._style['image-filters'])];
// if(!gradient){
// function componentToHex(c) {
// var hex = c.toString(16);
// return hex.length == 1 ? "0" + hex : hex;
// }
// function rgbToHex(r, g, b) {
// return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
// }
// gradient = {};
// var colorize = this._style['image-filters'].args;
// var increment = 1/colorize.length;
// for (var i = 0; i < colorize.length; i++){
// var key = increment * i + increment;
// var rgb = colorize[i].rgb;
// var formattedColor = rgbToHex(rgb[0], rgb[1], rgb[2]);
// gradient[key] = formattedColor;
// }
// this._gradients[gradientKey(this._style['image-filters'])] = gradient;
// }
// this._filters.gradient(gradient);
// this._filters.draw();
// }
// }
}
});