一，vue项目中使用echarts

说明

因为公司有一个大屏展示项目，最近一直在研究echarts这个图表工具，遇到了很多问题，花了很多时间去解决，在这里我会将我遇到的一些问题分享出来，只针对所遇到的问题，其它不是很重要的我会一笔带过，如果有好意见可以提出来，共同进步，共同学习，我会分很多节去总结问题，我也是刚接触这个echarts，有不完整的地方还请指教

一，引入完整echarts

---

1，安装依赖包  

npm install echarts --save

2，全局引入，在main.js中引入echarts  

       import echarts from 'echarts'  

       Vue.prototype.$echarts = echarts

二，按需引入echarts

---

1，全局引入体积很大，有很多我们不会用到的配置文件，所以建议按需引入，如果使用页面较多在main.js中引入就行，只有一个页面引入就写在.vue中--原文链接

按需引入echarts

main.js中

import echarts form './utils/echarts.js'

Vue.prototype.$echarts = echarts

2，页面中使用echarts

注意：

        1，echarts图表要渲染出来，div必须给定宽高，否则无法渲染

        2，如果想让图表随浏览器窗口自适应，可以使用addEventListener，具体代码如下，可以添加多个图表自适应，**这里注意this指向问题**

项目中引入echarts并不难，网上很多教程，但是在具体实现中就会有很多的问题，接下的文章我会把我的问题总结一下