Echarts在vue项目中的使用方法，数据添加到setOption里面的两种方式

Echarts在vue项目中的使用方法，数据添加到setOption里面的两种方式

<template>
  <div>
    <div style="width:500px;height:500px" ref="chart"></div>
  </div>
</template>
<script>
  export default{
    data () {
      return {};
    },
    mounted () {
      this.initCharts();
    },
    methods: {
      initCharts () {
        //得到所有图表的包
        var echarts = require('echarts');
        //包中调用init方法绑定元素
        let myChart = echarts.init(this.$refs.chart);
        console.log(this.$refs.chart)
        // 绘制图表
        myChart.setOption({
          title: { text: '在Vue中使用echarts' },
          tooltip: {},
          xAxis: {
            data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
          },
          yAxis: {},
          series: [{
            name: '销量',
            type: 'bar',
            data: [5, 20, 36, 10, 10, 20]
          }]
        });
      }
    },

  }




另一种写法：var option = {
          legend: {},
          tooltip: {},
          dataset: {
            source: [
              ['class', '软件工程1701B', '软件工程1702B', '软件工程1703B', '软件工程1801B'],
              ['迟到', 3, 5,1, 5],
              ['出勤', 31, 29, 29,32],
              ['未出勤',1,8,6, 4]
            ]
          },
          xAxis: [
            {type: 'category', gridIndex: 0},
            {type: 'category', gridIndex: 1}
          ],
          yAxis: [
            {gridIndex: 0},
            {gridIndex: 1}
          ],
          grid: [
            {bottom: '55%'},
            {top: '55%'}
          ],
          series: [
            // These series are in the first grid.
            {type: 'bar', seriesLayoutBy: 'row'},
            {type: 'bar', seriesLayoutBy: 'row'},
            {type: 'bar', seriesLayoutBy: 'row'},
            // These series are in the second grid.
            {type: 'bar', xAxisIndex: 1, yAxisIndex: 1},
            {type: 'bar', xAxisIndex: 1, yAxisIndex: 1},
            {type: 'bar', xAxisIndex: 1, yAxisIndex: 1},
            {type: 'bar', xAxisIndex: 1, yAxisIndex: 1}
          ]
        };

        myChartall.setOption(option);
</script>

比较基础，害怕自己好久不用忘掉啊！