adds isoline rendering in point renderer

This commit is contained in:
Francisco Dans 2015-08-13 22:19:33 +02:00
parent 4ee1f38499
commit 471cd3ec19

View File

@ -275,22 +275,43 @@ var contour = require('./contour');
var activePixels = tile.timeCount[key]; var activePixels = tile.timeCount[key];
var anchor = this.options.resolution/2; var anchor = this.options.resolution/2;
// var isolines = true;
// if (isolines){ if (activePixels) {
// var tileContour = this._contour(tile);
// ctx.beginPath(); /*
// ctx.strokeStyle = 'blue'; Torque Isolines
// var initialX = tileContour[0][0] * this.options.resolution + anchor; To be moved somewhere else (ideally something link isolines.js within /renderer/)
// var initialY = tileContour[0][1] * this.options.resolution + anchor; */
// ctx.moveTo(initialX, initialY); var isolines = true;
// for (var i = 1; i < tileContour.length; i++){ if (isolines) {
// var x = tileContour[i][0] * this.options.resolution + anchor; var grid = this._gridData(tile);
// var y = tileContour[i][1] * this.options.resolution + anchor; var cellsX = grid[0].length-1;
// ctx.lineTo(x, y); var cellsY = grid.length-1;
// ctx.stroke(); var contourValues = [0, 2, 4, 8, 16];
// } var res = this.options.resolution;
// } for(var c = 0; c < contourValues.length; c++){
// if (activePixels) { 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.strokeStyle = "#ffffff"
ctx.beginPath();
ctx.moveTo(x * res + anchor + res * pipe[0][0], pos.y + y * res + anchor + res * pipe[0][1]);
ctx.lineTo(x * res + anchor + res * pipe[1][0], pos.y + y * res + anchor + res * pipe[1][1]);
ctx.stroke();
if (pipe.length === 4){
ctx.beginPath();
ctx.moveTo(x * res + anchor + res * pipe[2][0], pos.y + y * res + anchor + res * pipe[2][1]);
ctx.lineTo(x * res + anchor + res * pipe[3][0], pos.y + y * res + anchor + res * pipe[3][1]);
ctx.stroke();
}
}
}
}
}
}
// var pixelIndex = tile.timeIndex[key]; // var pixelIndex = tile.timeIndex[key];
// for(var p = 0; p < activePixels; ++p) { // for(var p = 0; p < activePixels; ++p) {
// var posIdx = tile.renderDataPos[pixelIndex + p]; // var posIdx = tile.renderDataPos[pixelIndex + p];
@ -307,16 +328,43 @@ var contour = require('./contour');
// } // }
// } // }
// } // }
// } }
prof.end(true); prof.end(true);
}, },
_getPipe: function(cell, contour){
var parsedCell = cell.map(function(cornerValue){
if (cornerValue >= contour){
return "1";
}
return "0";
}).join("");
var type = parseInt(parsedCell, 2);
var N = [this._lerp(cell[1], cell[0], contour), 0],
S = [this._lerp(cell[2], cell[3], contour), 1],
E = [1, this._lerp(cell[2], cell[1], contour)],
W = [0, this._lerp(cell[3], cell[0], contour)]
// Blank
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]
},
_contour: function(tile, x, y){ _lerp: function(valueA, valueB, contourValue){
var tileGrid = this._gridData(tile); return Math.max(Math.min(1 + (-0.5) * (contourValue - valueA) / (valueB - valueA), 0.8), 0.2);
tileGrid = tileGrid.reverse();
// return d3.geom.contour(function(x, y) {
// return x >= 0 && y >= 0 && x < tileGrid[0].length && y < tileGrid.length && tileGrid[y][x] === 0;
// })
}, },
setBlendMode: function(b) { setBlendMode: function(b) {