在vue中使用echarts，遇到问题

Question

按照官网给的实例开发， 不明白为什么有两个坐标出现，请大佬指明。

this.lineChart = echarts.init(this.$refs.chart);
let dateList = this.chartData.map(function (item) {
  return item[0];
}), valueList = this.chartData.map(function (item) {
  return item[1];
}), lineChartOption = {
  visualMap: [
    {
      show: false,
 type: 'continuous',
 seriesIndex: 1,
 dimension: 0,
 min: 0,
 max: dateList.length
 }],
 tooltip: {
    trigger: 'axis'
 },
 xAxis: [{}, {
    data: dateList,
 gridIndex: 1
 }],
 yAxis: [{}, {
    splitLine: {show: false},
 gridIndex: 1
 }],
 grid: [{
    bottom: '60%'
 }, {
    top: '60%'
 }],
 series: [
    {
      type: 'line',
 showSymbol: false,
 data: valueList,
 xAxisIndex: 1,
 yAxisIndex: 1
 }]
}
this.lineChart.setOption(lineChartOption);

如何删除掉红框那个坐标轴？

Answer 1

审查一下元素吧，应该是有两个canvas被初始化了