echarts 5版本Vue项目中的使用

echarts 5版本中使用

先下载Echarts

npm install echarts --save

然后引入Echarts

import * as echarts from 'echarts' 

< ======= echarts 5.版本引入方式 ，旧版本引入不再支持   ======== >

Vue.prototype.$echarts = echarts

再页面组件中methods方法中使用

  methods: {
    getData () {
      var myChart = this.$echarts.init(document.getElementById('main'))
      var option = {
        title: {
          text: 'ECharts 入门示例'
        },
        tooltip: {},
        legend: {
          data: ['销量']
        },
        xAxis: {
          data: ['衬衫', '羊毛衫']
        },
        yAxis: {},
        eries: [{
          name: '销量',
          type: 'bar',
          data: [5, 20, 30]
        }]
      }
      // 使用刚指定的配置项和数据显示图表。
      myChart.setOption(option)
    }
  },

mounted () {

	this.getData  (  )

}