Sunng's Canvas based Heatmap API

Published at: 03:02 pm - Thursday February 11 2010

Glad to announce my works this morning: A simple heatmap API based on HTML5 canvas. The programming interface is rather simple now. To create such a heatmap, you just new a heatmap object by: <canvas width=”300″ height=”215″ id=”canv”></canvas> heatmap = new HeatMap(“canv”); Then read your dataset and push data into the heatmap: heatmap.push(x, y, value); [...]

Posted in: 广告, 手艺 by Sunng 21 Comments , , , ,

Open Source Charting Toolkits in JavaScript

Published at: 09:10 pm - Thursday October 22 2009

项目的下一阶段，需要做一些数据展现方面的工作，处于对Adobe产品的抵触情绪，我个人还是倾向于用JavaScript来完成。今天找了几个画Chart的库，比较一下功能和编程接口的使用，为接下来的开发做一些准备。 dojox.charting (BSD License) 没什么悬念，第一个想到的就是曾经用过的dojo。之前实习时候用dojo画chart也算是积累了一些心得。dojox.charting的最主要优点是编程接口完善、全面，可以配置的项目很多，接口易于编程，易于动态地生成、操作Chart。而另一方面最主要的问题就是文档比较匮乏，不了解的人可能问了，doc.dojotoolkit.org好强大，怎么会文档匮乏呢。其实是dojo和mootools类似，都很喜欢用option object来传递可选参数，但是这些option object在文档中没有任何涉及，很多关键的属性都在其中但是却没有办法查到，算是美中一大不足。 <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> <html xmlns=”http://www.w3.org/1999/xhtml”> <head> <script src=”dojo-release-1.3.2/dojo/dojo.js” djConfig=”isDebug: true”></script> <title>Dojo</title> <script type=”text/javascript”> dojo.require(“dojox.charting.Chart2D”); </script> </head> <body> <h1>Dojox.charting</h1> <div id=”charting” style=”width:400px; height:250px;”> </div> <script type=”text/javascript”> （function charting(){ dojo.empty(“charting”); var data = [2,4,5,7,7,4,4,7]; var chart = new dojox.charting.Chart2D(“charting”); chart.addPlot(“default”, {type: “Lines”, markers: true, shadows: [...]

Posted in: 手艺 by Sunng No Comments , , , , , ,