Vue引入ECharts图表

<div id="main" style="width: 60vw;height:700px;">div>
mounted() {
  this.initCharts();
},
methods: {
  initCharts() {
    this.initCharts = echarts.init(document.getElementById('main'));
    this.setOptiona()
  },
  setOptiona() {
    this.initCharts.setOption({
      title: {
        text: 'ECharts 入门示例'
      },
      tooltip: {},
      xAxis: {
        data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
      },
      yAxis: {},
      series: [{
        name: '销量',
        type: 'bar',
        data: [5, 20, 36, 10, 10, 20]
      }]
    })
  }
}

你可能感兴趣的:(VUE,vue,echarts)