关于RGraph

RGraph:是基于HTML5的canvas标签，采用Javascript画图的库。

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

缺点：浏览器必须支持HTML5，不能够保存图表。

1、它支持超过20多种不同类型的图表。

* Bar charts            柱状图

* Bi-polar charts    极区图

* Donut charts       圆环图

* Fuel charts          油量表

* Gauge charts      测量表

* Gantt charts        甘特图

* Horizontal bar charts      水平柱状图

* Horizontal progress bar 水平进度条图

* LED Grid  LED     网格图

* Line charts            线图

* Meter charts          路程图(半环）

* Odometer charts  里程表（全环）

* Pie charts              饼图

* Radar charts         雷达图

* Rose charts           玫瑰图

* Radial scatter charts 辐射图

* Scatter charts             散形图

* Thermometer charts  温度计

* Vertical progress bar 竖直进度条

*  Waterfall charts         瀑布图

2、RGraph简单易用，支持许多属性、事件和方法。

3、简单示例：

注意：导入相对应js库

<script src="libraries/RGraph.common.core.js"></script>  <!--核心库-->
<script src="libraries/RGraph.bar.js"></script>          <!--对应的Bar库-->
<script>
    window.onload = function ()
    {
        var data = [280,45,133];
        var bar = new RGraph.Bar('myCanvas', data);   //创建Bar对象
        bar.Set('chart.labels',['Richard','Alex','Nick']); //设置标签
        bar.Set('chart.gutter.left', 45);   //距离左边位置
        bar.Set('chart.background.grid', true);  //是否显示网格
        bar.Set('chart.title','bar char');   //标题
        bar.Set('chart.shadow', true); //阴影
        bar.Draw();
    }
</script>

<canvas id="myCanvas" width="300" height="200">
     Canvas not support on your browser.
</canvas>

效果如下：

参考：Rgraph官网 http://www.rgraph.net/