ECharts

ECharts

sf2gis@163.com

2016年10月9日

2016年10月11日 添加双轴柱状图

1 目标：在WEB页面展示统计报表等。

2原理：使用HTML5+JS技术构建动态、优美的图表。

ECharts是一个纯 Javascript 的图表库，底层依赖轻量级的 Canvas 类库 ZRender，提供直观，生动，可交互，可高度个性化定制的数据可视化图表。

ECharts的核心组件是echarts，使用一个div作为图表的容器，在其中展示图表。所有属性、操作通过option输入echarts对象。

参考：

http://echarts.baidu.com/tutorial.html#ECharts%20%E7%89%B9%E6%80%A7%E4%BB%8B%E7%BB%8D

3方法：

3.1 echarts对象：通过DIV指定html元素，使用echarts.init（）初始化对象。

           <divid="echarts" style="width:600px;height:400px;"></div>

           <scripttype="text/javascript" >

                 varmyChart=echarts.init(document.getElementById("echarts"));

3.2 echarts对象内容：echarts.setOption(opt);

3.2.1 标题title：显示图表标题。

3.2.2 鼠标提示tooltip：显示鼠标提示内容。

3.2.3 图例legend：通过data指定图例所指定的数据列名称。

3.2.4 坐标轴xAxis，yAxis：data指定坐标轴内容。可以指定两个坐标轴，数据内容通过指定坐标轴的index指定。

                      yAxis:[

                      {

                            name:'销量',

                            position:'left',

                            min:0,