在线生成热图的JavaScript库:heatmap.js

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

发表评论

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / 更改 )

Twitter picture

You are commenting using your Twitter account. Log Out / 更改 )

Facebook photo

You are commenting using your Facebook account. Log Out / 更改 )

Google+ photo

You are commenting using your Google+ account. Log Out / 更改 )

Connecting to %s