WEB项目中的（曲线图，柱状图，饼状图，以及两种基础弹出框）快速优雅实现

基于现在大部分WEB项目，尤其是到报表那一块内容时，必然会涉及到结果出图，并且导出EXCEL的一些基本功能。

于是我在网上找了一款展示优雅，操作便捷，简单易懂的两款插件(Echarts[图标],layer[弹出层]).

那么下面就简单的快速的不罗嗦先大概介绍下【截取至官网】：

ECharts，一个纯 Javascript 的图表库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等），底层依赖轻量级的 Canvas 类库ZRender，提供直观，生动，可交互，可高度个性化定制的数据可视化图表。

ECharts 3 中更是加入了更多丰富的交互功能以及更多的可视化效果，并且对移动端做了深度的优化。

ECharts 提供了常规的 折线图， 柱状图， 散点图， 饼图， K线图，用于统计的 盒形图，用于地理数据可视化的 地图， 热力图， 线图，用于关系数据可视化的 关系图， treemap，多维数据可视化的 平行坐标，还有用于 BI 的 漏斗图， 仪表盘，并且支持图与图之间的混搭。

当然不上图你们是不知道有多优雅，我第一眼就一个字描述，舒服！：

这个图是主角，但是我截图没办法体现它的动态效果，它是随x轴的属性不断慢慢变化的。

更多图片可以到它的官网上看http://echarts.baidu.com/

下面就开始介绍如何快速简单优雅实现饼状图，柱状图，折线图等。

其实官网上都有例子，我在这里写它的目的是为了更简便简单让大家去正确使用！

首先第一步： 在页面上为Echarts准备好一个DOM，以便让他显示出图形<div id="img" style="height:600px"></div>

第二步：引入Echarts的js文件

<script src="http://echarts.baidu.com/build/dist/echarts.js"></script>

当然文件可以从官网上下载（我不懒！！！http://echarts.baidu.com/download.html）

第三步：新建<script>标签中为模块加载器配置echarts和所需图表的路径（相对路径为从当前页面链接到echarts.js），引入图表文件见引入ECharts

<script type="text/javascript">
        // 路径配置