HTML5+JS极坐标散点图

HTML5 + JS Polar Scatter Charts

本文关键字：散点图 极坐标 HTML5+JS      更新时间：2023-09-26

有人能推荐现有的HTMl5/JS数据可视化工具包或库来帮助生成类似的极坐标散点图吗？代码示例会很酷！

http://matplotlib.sourceforge.net/examples/pylab_examples/polar_scatter.html

不幸的是，我不得不在平板电脑上做这项工作来查看数据的实时副本。所以没有flash，我不能每天使用matplotlib或其他程序预先生成这个。

提前谢谢！

更新：

我最终做的事情类似于：

http://mbostock.github.com/protovis/ex/transform.html

特别是以下代码帮助很大：

var x = pv.Scale.linear(-kx, kx).range(0, w),
    y = pv.Scale.linear(-ky, ky).range(0, h);
var data = pv.range(100).map(function(i) {
    var r = .5 + .2 * Math.random(), a = Math.PI * i / 50;
    return {x: r * Math.cos(a), y: r * Math.sin(a)};
  });

其中r由DB中的值驱动（非随机），并绘制类似于的气泡

http://mbostock.github.com/protovis/ex/bubble.html

根据我的喜好设置大小、标题和半径。

这将为您提供类似于matplotlib提供的加权极坐标散点图，而普通雷达图只允许您应用图标而不是加权气泡。

Sencha.com的EXT.js可以做到这一点。它也会自动渲染到Canvas和SVG。

http://dev.sencha.com/deploy/ext-4.0.7-gpl/examples/charts/Radar.html

您可以看看D3。他们有很多可视化的例子，包括散点图。

相关文章：