如何选择chart.js和Echarts——我为何放弃chart.js转战Echart？

在前段时间的开发中，我通过chart.js实现了大部分的图表效果，苦于chart.js的英文文档和欠缺美感的动画效果，我开始了我的Echart的学习。 在学习过程中，由于有了chart.js的学习基础，基本上学习过程也比较顺利。这里介绍一下Echart创建图标的基本流程。

第一步，同chart.js一样去获取对象
var element = document.getElementById("id")
var ctx = echarts.init(element);
这里可以简写为
var ctx = echarts.init(document.getElementById("id"));
但是由于我们有时候还是需要用到这个element对象的，所以多写一步也无妨

第二步
var option={}
这里不同chart.js的是，这里只需要创建一个option对象就行了，所有的内容都包含在内
至于用法的话，完全可以通过看Echart的官方文档去学，百度创建的Echart具备官方文档以及很全面的动画效果展示及代码，非常的友好

这里放上官方网站
https://echarts.apache.org/examples/zh/index.html#chart-type-lines3D
Echart的下载网站
https://www.jsdelivr.com/package/npm/echarts?path=dist

最后一步，创建图表对象
ctx.setOption(option);

这里放一个刚学的绑定点击事件的重新加载功能

ctx.on('click', function (params) {
    console.log(params);
    ctx.clear();
    ctx.setOption(option);
});

至于怎么去修改对象属性的话，只要对option一层一层往下找就可以实现了