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

shitass refactor

Browse Source
This commit is contained in:
Francisco Dans 2015-05-14 19:26:22 +02:00
parent ea4445ab8d
commit 1dfd2c6bf1
1 changed files with 40 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

75
lib/torque/renderer/ball.js
View File

@ -12,9 +12,8 @@ function BallRenderer(torqueLayer){
this.chWidth = this.canvas.width * 4; this.chWidth = this.canvas.width * 4;
this.height = this.canvas.height; this.height = this.canvas.height;
this.size = this.width * this.height; this.size = this.width * this.height;
this.pointLayer = new Uint8ClampedArray(this.size * 4); this.pointLayer = new Uint8ClampedArray(this.size);
this.drawnTemp = {}; this.drawnTemp = {};
this.prof = 0;
this.gradient = {}; this.gradient = {};
this.ballsSoFar = 0; this.ballsSoFar = 0;
this.balls = 0; this.balls = 0;
@ -22,6 +21,7 @@ function BallRenderer(torqueLayer){
this.availableWorkers = 10; this.availableWorkers = 10;
this.mode = "heat"; this.mode = "heat";
this.cachedBalls = []; this.cachedBalls = [];
this.isoplethLayer = new Uint8Array(this.size);
this.initialize(); this.initialize();
} }
BallRenderer.prototype = { BallRenderer.prototype = {
@ -40,23 +40,22 @@ BallRenderer.prototype = {
}, },
addBall: function(x0, y0, st){ addBall: function(x0, y0, st){
this.radius = st["marker-width"]; this.radius = st["marker-width"];
this.RW4 = this.radius * this.width *4;
if(this.cachedBalls[this.radius]){ if(this.cachedBalls[this.radius]){
if(x0 < 0 || y0 < 0 || x0 > this.width || y0 > this.height) return; if(x0 < 0 || y0 < 0 || x0 > this.width || y0 > this.height) return;
var startingPoint = this.getRIndexPos(x0, y0) - this.RW4 - this.radius*4; var startingPoint = this.getRIndexPos(x0, y0) - this.size - this.radius;
var i = 0, var i = 0,
pointer = startingPoint, pointer = startingPoint,
ballWidth = (this.radius*2)*4 ballWidth = (this.radius*2),
linemax = startingPoint + 2 * this.radius*4, linemax = startingPoint + 2 * this.radius,
endPoint = this.getRIndexPos(x0, y0) + this.RW4 + this.radius; endPoint = this.getRIndexPos(x0, y0) - this.cachedBalls[this.radius].length - this.radius
while (pointer <= endPoint){ while (pointer <= endPoint){
while (pointer <= linemax){ while (pointer <= linemax){
this.pointLayer[pointer+3] += this.cachedBalls[this.radius][i+3]; this.pointLayer[pointer] += this.cachedBalls[this.radius][i];
i+=4; i++;
pointer+=4; pointer++;
} }
linemax += this.width * 4; linemax += this.width;
pointer += this.width * 4 - ballWidth -4; pointer += this.width - ballWidth;
} }
} }
else{ else{
@ -64,7 +63,7 @@ BallRenderer.prototype = {
} }
}, },
precacheBall: function(x0, y0){ precacheBall: function(x0, y0){
this.cachedBalls[this.radius] = new Uint8ClampedArray(Math.pow(2 * this.radius + 1, 2)*4); this.cachedBalls[this.radius] = new Uint8ClampedArray(Math.pow(2 * this.radius + 1, 2));
x0 = this.radius; x0 = this.radius;
y0 = this.radius; y0 = this.radius;
var orad = this.radius; var orad = this.radius;
@ -100,8 +99,8 @@ BallRenderer.prototype = {
} }
}, },
addPoint: function(x, y, alpha){ addPoint: function(x, y, alpha){
var indexPos = (y*(this.radius*2+1)+x)*4; var indexPos = y*(this.radius*2+1)+x;
this.cachedBalls[this.radius][indexPos + 3] += alpha; this.cachedBalls[this.radius][indexPos] += alpha;
}, },
map_range: function(value, low1, high1, low2, high2) { map_range: function(value, low1, high1, low2, high2) {
return low2 + (high2 - low2) * (value - low1) / (high1 - low1); return low2 + (high2 - low2) * (value - low1) / (high1 - low1);
@ -113,10 +112,11 @@ BallRenderer.prototype = {
}, },
draw: function(modeData, dataArray){ draw: function(modeData, dataArray){
if(this.mode === "contour"){ if(this.mode === "contour"){
this.contour(); this.contour(5);
dataArray = this.fillLayer(this.contourLayer);
} }
else if(this.mode === "isopleth"){ else if(this.mode === "isopleth"){
this.contour(3); this.contour(10);
this.isopleth(); this.isopleth();
} }
else if(this.mode === "heat"){ else if(this.mode === "heat"){
@ -124,7 +124,7 @@ BallRenderer.prototype = {
} }
if (!dataArray){ if (!dataArray){
if (this.isoplethLayer) dataArray = this.isoplethLayer; if (this.isoplethLayer) dataArray = this.isoplethLayer;
else if (this.contourLayer) dataArray = this.contourLayer; else if (this.contourLayer) dataArray = this.fillLayer(this.contourLayer);
else if (this.heatmapLayer) dataArray = this.heatmapLayer; else if (this.heatmapLayer) dataArray = this.heatmapLayer;
else dataArray = this.pointLayer; else dataArray = this.pointLayer;
} }
@ -132,6 +132,13 @@ BallRenderer.prototype = {
this.imageData.data.set(dataArray); this.imageData.data.set(dataArray);
this.ctx.putImageData(this.imageData, 0, 0); this.ctx.putImageData(this.imageData, 0, 0);
}, },
fillLayer: function(layer){
var tempList = new Uint8Array(layer.length * 4);
for(i = 0; i<layer.length; i++){
tempList[i*4 + 3] = layer[i];
}
return tempList;
},
mergeLayers: function(from, to){ mergeLayers: function(from, to){
if (from.length !== to.length) throw("layers aren't of the same size"); return; if (from.length !== to.length) throw("layers aren't of the same size"); return;
for (var i = 0; i<to.length; i++){ for (var i = 0; i<to.length; i++){
@ -146,28 +153,28 @@ BallRenderer.prototype = {
}, },
invalidate: function(){ invalidate: function(){
if(this.torqueLayer.options.steps > 1){ if(this.torqueLayer.options.steps > 1){
for (var i = 0, len = this.pointLayer.length; i< len; i+=4){ for (var i = 0, len = this.pointLayer.length; i< len; i++){
this.pointLayer[i + 3] -= 10; this.pointLayer[i] -= 10;
} }
} }
else{ else{
this.pointLayer = new Uint8ClampedArray(this.size * 4); this.pointLayer = new Uint8ClampedArray(this.size);
} }
if(typeof this.isoplethLayer !== 'undefined'){ if(typeof this.isoplethLayer !== 'undefined'){
this.contourLayer = new Uint8ClampedArray(this.size * 4); this.contourLayer = new Uint8Array(this.size);
this.isoplethLayer = new Uint8Array(this.size * 4); this.isoplethLayer = new Uint8Array(this.size);
} }
else if(typeof this.contourLayer !== 'undefined'){ else if(typeof this.contourLayer !== 'undefined'){
this.contourLayer = new Uint8ClampedArray(this.size * 4); this.contourLayer = new Uint8Array(this.size);
} }
else if(typeof this.heatmapLayer !== 'undefined'){ else if(typeof this.heatmapLayer !== 'undefined'){
this.heatmapLayer = new Uint8ClampedArray(this.size * 4); this.heatmapLayer = new Uint8Array(this.size * 4);
} }
}, },
getRIndexPos: function(x,y){ getRIndexPos: function(x,y){
var rIndexPos = (y*this.width+x)*4; var rIndexPos = y*this.width+x;
return rIndexPos; return rIndexPos;
}, },
getXYFromRIndex: function(index){ getXYFromRIndex: function(index){
@ -212,22 +219,18 @@ BallRenderer.prototype = {
} }
} }
var gradient = this.contourGradient; var gradient = this.contourGradient;
if(!this.contourLayer) this.contourLayer = new Uint8ClampedArray(this.size * 4); if(!this.contourLayer) this.contourLayer = new Uint8Array(this.size);
for (var i = this.pointLayer.length-4, alpha; i>=0; i-=4){ for (var i = 0, len = this.pointLayer.length, alpha; i<len; i++){
if(this.pointLayer[i+3] > 0){ if(this.pointLayer[i] > 0){
var currentAlpha = this.pointLayer[i+3]; var alpha = this.pointLayer[i];
this.contourLayer[i+0] = 255; this.contourLayer[i] = gradient[alpha*4+3];
this.contourLayer[i+1] = 105;
this.contourLayer[i+2] = 180;
this.contourLayer[i+3] = gradient[currentAlpha*4+3];
} }
} }
}, },
isopleth: function(){ isopleth: function(){
if(typeof this.isoplethLayer === 'undefined') this.isoplethLayer = new Uint8Array(this.size * 4);
for (var i = 0, len = this.contourLayer.length; i<len; i+=4){ for (var i = 0, len = this.contourLayer.length; i<len; i+=4){
var alpha = this.contourLayer[i + 3]; var alpha = this.contourLayer[i + 3];
if (alpha > 20 && alpha < 255){ if (alpha > 100 && alpha < 120){
var n = i - this.chWidth, var n = i - this.chWidth,
s = i + this.chWidth, s = i + this.chWidth,
neighbors = [n, n + 4, i + 4, s + 4, s, s - 4, i - 4, n -4]; neighbors = [n, n + 4, i + 4, s + 4, s, s - 4, i - 4, n -4];