vue中使用Echart

一、安装

npm install echarts --save

二、全局注册

Vue.prototype.$echarts = echarts

三、使用方法

       let myChart = this.$echarts.init(document.getElementById("myChart"));

引入主题的方法

第一种状况：使用Echart 主题里面的文件

在main.js引用主题JS  --    import  'echarts/theme/shine.js'
使用方法 -- let myChart = this.$echarts.init(document.getElementById('myChart'),'shine');

第二种状况：使用本身文件夹中的主题

若是咱们把theme的js放到本身的文件夹中，直接放会报错，有2个解决方法

第一种解决方法

一、修改shine.js代码格式    var theme = {  }   并增长  export default theme 导出

二、在main.js 中 引入并注册

import echarts from 'echarts'
import theme from '@/assets/js/theme/shine.js'
Vue.prototype.theme = theme

三、使用方法

 let myChart = this.$echarts.init(
        document.getElementById("myChart"),
        this.theme
 );

第二种解决方法

一、修改shine.js 代码

把 js文件里的root.echarts 改为echarts；而后在该js文件内 import echarts from 'echarts'

二、在main.js中引入   import '@/assets/js/theme/shine.js'

三、使用方法

      let myChart = this.$echarts.init(         document.getElementById("myChart"),         "shine"       );