首先导入相应的 js :
echarts.min.js
china.js(需要显示中国地图才导入这个)
相关js下载(上传百度云太麻烦,没积分的小伙伴可以联系我私发 ^-^)
完成一个简单的ECharts报表,简单总结就这几步:
1、在需要显示图表的地方定义好 div 并给定宽高,注意在初始化之前一定要给定宽高,否则即使代码正确最后也不会显示。
2、初始化 div 容器:var mycharts = echarts.init(document.getElementById(“xxx”));
3、定义样式(折线图、柱状图、饼图、散点图等),自己不会写代码可以直接去官网找,官网也提供在线编辑的功能,可以调试后直接复制到代码中。根据官网上的例子只要正确获取后台的数据保证格式正确填入相应的位置即可。
4、将容器与样式结合:mychart.setOption(option);
ps:括号里的 option 就是步骤三中定义样式的变量名。
例:
<script>
var mycharts = echarts.init(document.getElementById("xxx"));
var option = {
//...
};
mycharts.setOption(option);
</script>