首先，你需要下载ECharts所需的文件，我使用的是echarts-2.0.2版本，点击这里下载：echarts-2.0.2
下载解压后，下面有一系列文件夹，其中build中有我们需要引入的JS文件，doc里面是ECharts的API文档以及实例。
使用ECharts有两种方式，一种是通过模块化单文件引入的方式，另一种是通过标签式单文件引入。我们这里使用标签式单文件引入。
一、第一个ECharts报表
首先新建一个echarts.html文件。为ECharts准备一个具备大小（宽高）的Dom。
<!DOCTYPE html> <head> <meta charset="utf-8"> <title>ECharts</title> </head> <body> <!-- 为ECharts准备一个具备大小（宽高）的Dom --> <div id="main" style="height:400px"></div> </body>
接着新建<script>标签引入echarts-plain.js
<!DOCTYPE html> <head> <meta charset="utf-8"> <title>ECharts</title> </head> <body> <!-- 为ECharts准备一个具备大小（宽高）的Dom --> <div id="main" style="height:400px"></div> <!-- ECharts单文件引入 --> <script src="http://echarts.baidu.com/build/echarts-plain.js"></script> </body>
注：这里引入的是百度官网的文件，你可以将其替换成你自己下载的ECharts build文件夹下的JS文件
接着新建<script>标签，使用全局变量echarts初始化图表并驱动图表的生成
1 <!DOCTYPE html> 2 <head> 3 <meta charset="utf-8"> 4 <title>ECharts</title> 5 </head> 6 <body> 7 <!-- 为ECharts准备一个具备大小（宽高）的Dom --> 8 <div id="main" style="height:400px"></div> 9 <!-- ECharts单文件引入 --> 10 <script src="http://echarts.baidu.com/build/echarts-plain.js"></script> 11 <script type="text/javascript"> 12 // 基于准备好的dom，初始化echarts图表 13 var myChart = echarts.init(document.getElementById('main')); 14 15 var option = { 16 tooltip: { 17 show: true 18 }, 19 legend: { 20 data:['销量'] 21 }, 22 xAxis : [ 23 { 24 type : 'category', 25 data : ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"] 26 } 27 ], 28 yAxis : [ 29 { 30 type : 'value' 31 } 32 ], 33 series : [ 34 { 35 "name":"销量", 36 "type":"bar", 37 "data":[5, 20, 40, 10, 10, 20] 38 } 39 ] 40 }; 41 42 // 为echarts对象加载数据 43 myChart.setOption(option); 44 </script> 45 </body>