echarts bar legend 如何配置？

Question

option = {
    legend: {
        //...
    },
    xAxis: {
        name:'a',
        type: 'category',
        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
    },
    yAxis: {
        type: 'value'
    },
    series: [{
        data: [120, 200, 150, 80, 70, 110, 130],
        type: 'bar'
    }]
};

legend 如何显示 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'，在不改变 series 的 data 结构情况下

Answer 1

这部分可以不用echarts自己做，点击的时候设置对应的数据然后重新渲染

    <div class="list">
        <div class="item" v-for="(item, i) in xAxisArr" :key="item" @click="setseriesData(i)">{{ item }}</div>
    </div>

  data () {
    return {
      xAxisArr: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
      seriesArr: [120, 200, 150, 80, 70, 110, 130]
    }

  methods: {
    setseriesData (index) {
      //...
      this.option.series[0].data[index] = this.option.series[0].data[index] ? 0 : this.seriesArr[index]
      //...
    }
  },