Love.Passion.Dream

选择适合你项目的图表库

我想在开发很多网站,尤其是一些后台数据统计管理的网站的时候难免会需要绘制各种各样的图形,那么显然我们首先需要考虑的是我们应该使用什么样的库,通过什么样的技术方案去绘制这些图形。哪怕你是处在一个财大气粗的网站,你们的人很闲,可以自己开发一个库。那么我想怎么去设计一个适合你项目的库也是很关键的,如果一开始走错了,那么后面只会陷入难以自拔的泥潭。

世界上没有万金油,显然在软件开发领域也一样,同一个技术方案不可能适用于所有的情形。那么如何去选择一个网站图形绘制库呢?首先确定这个问题的时候你应该先回答几个问题:

1:是否要兼容老版本的浏览器IE6+?IE8+?(此处蛋疼一下......)

2:数据展现形式会有哪些形态,只是一个饼图?或者还会有更复杂的多折线图?地图?考虑这个问题的时候最好具有一定的远瞻性,通过项目的本质去寻找答案。

3:对定制的要求是否强烈,如果是面向用户的界面,那么可能你的产品是不会放过你的。

4:对易用性易维护性要去是否强烈,一般来说这个问题和前几个问题相关,如果只是很简单的项目组内部自己用的需求,那么可能就需要简易一点的,容易上手的库。

如果你确定了以上这几个问题答案那么我们来给出下合适的结果吧。

1:如果要兼容老版本的浏览器,那么可以用highcharts,flash,raphaeljs 这样的库,如果只是需要在高级浏览器上运行那么可以采用一些新的,比如d3js这样用svg的库。

2:数据的展现形式如果比较简单,只是饼图或者柱状图的时候可以用一些特地针对你所需要的功能的比较简单库,hightcharts是个不错的选择,另外highstock可以用来绘制一些股票类的信息,但是如果你需要太复杂的图表可能就需要结合几个库或者用比较基础的库然后自己去绘制,比如d3js和raphaeljs。

3:对定制的要求比较强烈的话hightchars就不能用了,d3js是个不错的选择,但是有兼容性问题,所以可以用raphaelis。或者土豪自己写一个吧。

4:其实前面三个问题问完已经差不多可以回答第四个问题了,我看来主要分为两大类库,第一类是灵活性不太好,更靠近应用层,但是简单易用,上手容易,已经是比较完善的组件了。适用于一些公司内部使用的系统或者图标不是特别多特别重要的系统,也适合不熟悉前端开发的开发者使用,代表是hightcharts。第二类是比较靠底层的库,算不上组件,算是基础库,需要自己绘制开发相应的图形,但是灵活性打大提高了,再也不用被PM鄙视了,代表是d3js。


附上一个宝库:

50 JavaScript Libraries for Charts and Graphs

中文版网上搜索下应该有。有时间整理下,弄一个类似于心理分析题一样的东西,回答完几个问题后给出可用的库。