diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..40b878d --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +node_modules/ \ No newline at end of file diff --git a/demo/index.html b/demo/index.html index f8de37d..3bd1625 100644 --- a/demo/index.html +++ b/demo/index.html @@ -3,28 +3,35 @@ simpleheat demo -

+ +

simpleheat is a tiny and fast JS heatmap library. More on mourner / simpleheat

-
-
-
- -
+
+ +
+
+
+
+ +
+ +
@@ -48,7 +55,6 @@ console.timeEnd('draw'); frame = null; } - draw(); get('canvas').onmousemove = function (e) { @@ -58,6 +64,8 @@ var radius = get('radius'), blur = get('blur'), + width = get('width'), + height = get('height'), changeType = 'oninput' in radius ? 'oninput' : 'onchange'; radius[changeType] = blur[changeType] = function (e) { @@ -65,6 +73,16 @@ frame = frame || window.requestAnimationFrame(draw); }; +width[changeType] = height[changeType] = function (e) { + var container = get('container'); + var canvas = get('canvas'); + canvas.width = width.value; + canvas.height = height.value; + container.style.width = width.value + "px"; + container.style.height = height.value + "px"; + heat.resize(); +} + diff --git a/simpleheat.js b/simpleheat.js index dc06eb9..cbe105d 100644 --- a/simpleheat.js +++ b/simpleheat.js @@ -70,8 +70,23 @@ simpleheat.prototype = { }, resize: function () { + var canvasWidth = parseInt(this._canvas.width,10); + var canvasHeight = parseInt(this._canvas.height,10); + var self = this; + if (this._data != null) { + this._data = this._data.map(function(point) { + return [ + point[0]*canvasWidth/self._width, + point[1]*canvasHeight/self._height, + point[2]] + }) + } + this._width = this._canvas.width; this._height = this._canvas.height; + this.draw(); + + return this; }, gradient: function (grad) {