RGraph: Free HTML5 and JavaScript charts

After research js chart library, I determine to use RGraph:http://www.rgraph.net/

RGraph:是基于HTML5canvas标签,采用Javascript画图的库。

优点:由于是采用js在客户端浏览器上画图,所以它能快速显示页面和减轻服务器负载。

缺点:浏览器必须支持HTML5,不能够保存图表。(I think it can be saved as picture easierly)

本文介绍一款名叫Rgraph的插件,使用RGraph统计图制作插件的话,可以将这个资源占用减少到接近零的程度,因为所有创建统计图的工作都是在客户端完成的,就像渲染HTML网页一样,服务器端只负责发送数据,不再负责统计图的生成与发送了,同时带宽的占用情况也大大得到了改善。
另外,由于统计图是依靠JavaScript来生成的,所以当你查看这个显示统计图的HTML网页的时候,该网页是可以为离线状态的了。

chart.gutter.right就是当前chart相对于你的canvas的左边距;
chart.hmargin.grouped
就是每一组bar里面的每个柱形的间距。

Some document about RGraph:

1. HTML5 canvas图形库RGraph

http://www.cnblogs.com/shanyou/archive/2012/10/22/2734570.html

2. 加载JSON文件并在 RGraph 中以 柱状图来展示

http://blog.csdn.net/lowkeyway/article/details/7967649

3. RGraph统计图制作插件的使用方法

http://www.runqian.com.cn/archives/4010.html/

4. How to use JSON data

http://www.rgraph.net/docs/howto-json-data.html

Note :

1. Many browsers restrict JavaScript from accessing localfile system owing to security reasons. The JavaScript charts, when runninglocally, will not be able to access data provided as a URL. If you run thefiles from a server, it will run absolutely fine, though. When running locally,however, if you provide the data as string (using theData Stringmethod), it works fine.

2. For support for Internet Explorer < 9, you can useExcanvas, a canvas emulator; this is used in the examples bundledwith Flot. You just include the excanvas script like this:

<!--[if lte IE8]><script language="javascript"type="text/javascript"src="excanvas.min.js"></script><![endif]-->

你可能感兴趣的:(JavaScript)