heatmap.js源自前段时间为KISSY写的一个组件,用途为在网页上生成热图,当然,现在它是独立的,不依赖于任何第三方库。

它的使用非常简单,首先要有一个Canvas元素,比如:

<div>
	<canvas id="test-canvas"></canvas>
</div>

然后,就可以创建HeatMap对象了,比如:

// 定义画布尺寸
var w = 640;
var h = 480;

// 创建 HeatMap 对象
var hm = new HeatMap(document.getElementById("test-canvas"), w, h);
var points = [
		[120, 23],
		[39, 224],
		[87, 138]
	];

// 添加数据
hm.addData(points);

// 渲染画布
hm.render();

一个示例图形如:

Snip20131029 36

另外,这个JS库的算法来自我以前写的另一个基于Python的热图库:pyHeatMap