Skip to content

Commit

Permalink
fixes #29 API should provide method to visualize data based not only …
Browse files Browse the repository at this point in the history 
…on the color of region but also on any other parameter. Marker parameters can be used for visualization as well.
  • Loading branch information
@bjornd
bjornd committed Jun 3, 2012
1 parent d450e1c commit 60ddf98
Show file tree
Hide file tree
Showing 6 changed files with 488 additions and 402 deletions.
163 changes: 20 additions & 143 deletions lib/color-scale.js
View file
@@ -1,154 +1,21 @@
jvm.ColorScale = function(colors, normalizeFunction, minValue, maxValue) {
if (colors) this.setColors(colors);
if (normalizeFunction) this.setNormalizeFunction(normalizeFunction);
if (minValue) this.setMin(minValue);
if (maxValue) this.setMax(maxValue);
jvm.ColorScale.parentClass.apply(this, arguments);
}

jvm.ColorScale.prototype = {
colors: [],
jvm.inherits(jvm.ColorScale, jvm.NumericScale);

setMin: function(min) {
this.clearMinValue = min;
if (typeof this.normalize === 'function') {
this.minValue = this.normalize(min);
} else {
this.minValue = min;
}
},
jvm.ColorScale.prototype.setScale = function(scale) {
var i;

setMax: function(max) {
this.clearMaxValue = max;
if (typeof this.normalize === 'function') {
this.maxValue = this.normalize(max);
} else {
this.maxValue = max;
}
},

setColors: function(colors) {
var i;

for (i = 0; i < colors.length; i++) {
colors[i] = jvm.ColorScale.rgbToArray(colors[i]);
}
this.colors = colors;
},

setNormalizeFunction: function(f) {
if (f === 'polynomial') {
this.normalize = function(value) {
return Math.pow(value, 0.2);
}
} else if (f === 'linear') {
delete this.normalize;
} else {
this.normalize = f;
}
this.setMin(this.clearMinValue);
this.setMax(this.clearMaxValue);
},

getColor: function(value) {
var lengthes = [],
fullLength = 0,
l,
i,
c,
color;

if (typeof this.normalize === 'function') {
value = this.normalize(value);
}
for (i = 0; i < this.colors.length-1; i++) {
l = this.vectorLength(this.vectorSubtract(this.colors[i+1], this.colors[i]));
lengthes.push(l);
fullLength += l;
}

c = (this.maxValue - this.minValue) / fullLength;
for (i=0; i<lengthes.length; i++) {
lengthes[i] *= c;
}

i = 0;
value -= this.minValue;
while (value - lengthes[i] >= 0) {
value -= lengthes[i];
i++;
}

if (i == this.colors.length - 1) {
color = this.vectorToNum(this.colors[i]).toString(16);
} else {
color = (
this.vectorToNum(
this.vectorAdd(this.colors[i],
this.vectorMult(
this.vectorSubtract(this.colors[i+1], this.colors[i]),
(value) / (lengthes[i])
)
)
)
).toString(16);
}

while (color.length < 6) {
color = '0' + color;
}
return '#'+color;
},

vectorToNum: function(vector) {
var num = 0,
i;

for (i = 0; i < vector.length; i++) {
num += Math.round(vector[i])*Math.pow(256, vector.length-i-1);
}
return num;
},

vectorSubtract: function(vector1, vector2) {
var vector = [],
i;

for (i = 0; i < vector1.length; i++) {
vector[i] = vector1[i] - vector2[i];
}
return vector;
},

vectorAdd: function(vector1, vector2) {
var vector = [],
i;

for (i = 0; i < vector1.length; i++) {
vector[i] = vector1[i] + vector2[i];
}
return vector;
},

vectorMult: function(vector, num) {
var result = [],
i;

for (i = 0; i < vector.length; i++) {
result[i] = vector[i] * num;
}
return result;
},

vectorLength: function(vector) {
var result = 0,
i;
for (i = 0; i < vector.length; i++) {
result += vector[i] * vector[i];
}
return Math.sqrt(result);
for (i = 0; i < scale.length; i++) {
this.scale[i] = jvm.ColorScale.rgbToArray(scale[i]);
}
}

jvm.ColorScale.prototype.getValue = function(value) {
return jvm.ColorScale.numToRgb(jvm.ColorScale.parentClass.prototype.getValue.call(this, value));
}

jvm.ColorScale.arrayToRgb = function(ar) {
var rgb = '#',
d,
Expand All @@ -161,6 +28,16 @@ jvm.ColorScale.arrayToRgb = function(ar) {
return rgb;
}

jvm.ColorScale.numToRgb = function(num) {
num = num.toString(16);

while (num.length < 6) {
num = '0' + num;
}

return '#'+num;
}

jvm.ColorScale.rgbToArray = function(rgb) {
rgb = rgb.substr(1);
return [parseInt(rgb.substr(0, 2), 16), parseInt(rgb.substr(2, 2), 16), parseInt(rgb.substr(4, 2), 16)];
Expand Down
80 changes: 80 additions & 0 deletions lib/data-series.js
View file
@@ -0,0 +1,80 @@
jvm.DataSeries = function(params, elements) {
var scaleConstructor;

params = params || {};
params.attribute = params.attribute || 'fill';
params.scale = params.scale || ['#C8EEFF', '#0071A4'];

scaleConstructor = params.attribute === 'fill' || params.attribute === 'stroke' ? jvm.ColorScale : jvm.NumericScale

this.elements = elements;
this.params = params;

if (params.attributes) {
this.setAttributes(params.attributes);
}

this.scale = new scaleConstructor(params.scale, params.normalizeFunction, params.valueMin, params.valueMax);
if (params.values) {
this.values = params.values;
this.setValues(params.values);
}
}

jvm.DataSeries.prototype = {
setAttributes: function(key, attr){
var attrs = key,
code;

if (typeof key == 'string') {
this.elements[key].setStyle(this.params.attribute, attr);
} else {
for (code in attrs) {
if (this.elements[code]) {
this.elements[code].element.setStyle(this.params.attribute, attrs[code]);
}
}
}
},

setValues: function(values) {
var max = 0,
min = Number.MAX_VALUE,
val,
cc,
attrs = {};

for (cc in values) {
val = parseFloat(values[cc]);
if (val > max) max = values[cc];
if (val && val < min) min = val;
}
this.scale.setMin(min);
this.scale.setMax(max);

for (cc in values) {
val = parseFloat(values[cc]);
if (val) {
attrs[cc] = this.scale.getValue(val);
} else {
attrs[cc] = this.elements[cc].element.style.initial[this.params.attribute];
}
}
this.setAttributes(attrs);
this.values = values;
},

setScale: function(colors) {
this.colorScale.setColors(colors);
if (this.values) {
this.setValues(this.values);
}
},

setNormalizeFunction: function(f) {
this.colorScale.setNormalizeFunction(f);
if (this.values) {
this.setValues(this.values);
}
}
}

0 comments on commit 60ddf98

Please sign in to comment.