如何从Echart库的折线图中去除网格

12
我将使用echart库绘制一条折线图。当我绘制图表时,它会显示出网格。我不需要网格,但我无法删除它。我已经查看了Echart选项,我知道grid:{show=false}是echart的一个选项,但它并不起作用。我的代码片段如下。
function lineGraph(xAxisLabels){    
var echartLine = echarts.init(document.getElementById('myElineChart')); 
  echartLine.setOption({
    grid: {show: false},
    xAxis: [{
      type: 'category',
      showGrid: false,
      data: xAxisLabels
    }],
    yAxis: [{
      type: 'value',    
    }],
    series: [{
      name: 'Actual',
      type: 'line',
      data: [820, 932, 901, 934, 1290, 1330, 1320]
    }],
  });}

以下是结果: 输入图像描述
如果您能帮助我,我会非常感激。
2个回答

29

虽然我来晚了,但如果未来有人需要帮助的话,我来回答这个问题。

认为这是由于网格属性(grid attribute)引起的猜测是不错的,但实际上默认情况下,网格被设置为false。这些线条是由您的X和Y轴上的一个名为splitLine的属性生成的,它使其看起来像是一个网格。您可以通过更改如下所示的属性来删除它:

function lineGraph(xAxisLabels){    
var echartLine = echarts.init(document.getElementById('myElineChart')); 
  echartLine.setOption({
    grid: {show: false},
    xAxis: [{
      type: 'category',
      showGrid: false,
      data: xAxisLabels,
      splitLine: {
         show: false
      },
    }],
    yAxis: [{
      type: 'value',   
      splitLine: {
         show: false
      },
    }],
    series: [{
      name: 'Actual',
      type: 'line',
      data: [820, 932, 901, 934, 1290, 1330, 1320]
    }],
  });}

1
xAxis: {
    axisLine: {
        show: false, // Hide full Line
    },
    xisTick: {
        show: false, // Hide Ticks,
    },
}

完整结果

enter image description here


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接