ECharts，一个纯 Javascript 的图表库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等），底层依赖轻量级的 Canvas 类库 ZRender，提供直观，生动，可交互，可高度个性化定制的数据可视化图表。
ECharts 3 中更是加入了更多丰富的交互功能以及更多的可视化效果，并且对移动端做了深度的优化。
一、 echarts下载
下载页：http://echarts.baidu.com/download.html
二、使用三步走
- 在页面中指定一个div并指定宽高：
<div style="100%;height:500px;" id="map_charts"></div> - 页面中引用js
<script type="text/javascript" src="echarts.min.js"></script> - 页面加载完毕后调用代码初始化
option参数配置见文档：http://echarts.baidu.com/option.html
var myChart = echarts.init(document.getElementById('map_charts'));//一个div只能有一个实例
var option={}//..图表的配置
myChart.setOption(option);
关于地图图表
需要引用中国区域的js或者使用json初始化地图
下载中国/世界地图的js或者json 文档：http://echarts.baidu.com/download-map.html 文档底部有js和json的使用示例
JavaScript 引入示例
<script src="echarts.js"></script>
<script src="map/js/china.js"></script>
<script>
var chart = echarts.init(document.getElementById('main'));
chart.setOption({
series: [{
type: 'map',
map: 'china'
}]
});
</script>
JSON 引入示例
$.get('map/json/china.json', function (chinaJson) {
echarts.registerMap('china', chinaJson);
var chart = echarts.init(document.getElementById('main'));
chart.setOption({
series: [{
type: 'map',
map: 'china'
}]
});
});