数据可视化最近很火，qq做的这个星云图大家都不会陌生吧。 腾讯的星云图是flash实现的，最近D3.js貌似很火的样子，打算用D3实现类似的星云图来展现公司的实时订单情况。

D3官网上有类似的例子，不过都是美国的地图，现在主要的问题是地图如何用SVG准确的画出来。 还好在网上找到了一个使用json来描述中国的各省份经纬度界限以及国界。文件链接http://h5demo.sinaapp.com/gtxorder/china.json

接下来就可以用D3提供的丰富的插件来实现星云图了,主要用到了d3.geo.js和d3.jsonp.js，官网有具体的文档。d3.jsonp.js主要是为了跨域访问网站返回来的订单数据。

demo url http://h5demo.sinaapp.com/gtxorder/

由于订单数比较少，每三分钟请求一次订单接口，返回当天0点到现在的订单数和具体经纬度，考虑到订单变化较小，适当做了一些随即闪烁的动画。想要看真实的数据可以打开浏览器的控制台查看。