说明：东西肯定是别人写好的呮不过最近有使用到，所以解锁一项新技能。以后做统计什么的就可以考虑用这个了。

首先是官方参考文档、实例什么的

然后我把代碼剥离了一下：

1.新建一个web工程然后把从官网上下载好的echarts-all.js这个文件导到web目录下（我这里是建的一个没Maven工程，但是都一样）

2.新建一个jsp，注意是jsp！！！！反正我建html是没有测试成功。

这里只是测试一种显示的方式，官网上有各种各样的图形我们只需要把官网上例子中option的代碼扣过来，那么静态的图表就已经实现了。如果需要动态的填充数据那么自己后台传数据过来就好了。。

　　　　不多说直接上干货！

同为设计师 一般我会在ECharts Gallery 上直接配置图表，因为Gallery上你不需要从零开始一点点写代码写出一个图表而且有很多用户已经配置好的图表，我可以参考或直接克隆使用

我的操作一般是：找个和我想做的图表类型吻合的例子，将例子代码中的数据、颜色等配置项更改为我的数据ECharts 左边虽然是代码编辑，但是其Φ涉及到样式和数据相关的基础配置看单词的意思就很容易找到的，在这些配置项上直接输入想换的参数替换即可并且在代码编辑区域所有的有效替换都能在右边图表上所见即所得的展示出来！

相信设计的同学在成功更改了几个配置项之后，会有很直观的成就感很可能就会各种改改改到根本停不下来~~

有篇教程文章可供参考体验：