如何删除chart.js上的网格

Question

我正在使用 Chart.js 进行测试并尝试删除网格。我的代码：

function grafica(){
    var chartData = {
        labels: [" ", " ", " "],
        datasets: [
            {
                fillColor: "#79D1CF",
                strokeColor: "#79D1CF",//marges
                data: [30, 40, 45]
            }, {
                fillColor: "rgb(210,27,71)",
                strokeColor: "rgb(210,27,71)",//marges
                data: [56, 55, 40]
            }, {
                fillColor: "rgba(210,27,71,0)",
                strokeColor: "rgba(210,27,71,0)",//marges
                data: [0, 0, 0]
            }
        ]
    };
    var ctx = document.getElementById("myChart").getContext("2d");
    var myBar = new Chart(ctx).Bar(chartData, {
        showTooltips: false,
        onAnimationComplete: function () {
            var ctx = this.chart.ctx;
            ctx.font = this.scale.font;
            ctx.fillStyle = this.scale.textColor;
            ctx.textAlign = "center";
            ctx.textBaseline = "bottom";
        }
    });
}

我该怎么做？我尝试了一些诸如添加“ ctx.gridLines = false; ”和“ ctx.ticks = false; ”之类的方法，但目前一切正常。

编辑：我按照您的指示做了一些更改，但我不知道为什么会起作用。我使用的版本是 2.0.0-alpha

Answer 1

在 v3（更新文档）上更改为

options: {
  scales: {
    x: {
      grid: {
        display: false
      }
    },
    y: {
      grid: {
        display: false
      }
    }
  },
}

Answer 2

我现在使用的是 2.0Alpha 版本，和你一样。

更新的文档链接

下面是一个没有网格线的简单条形图的例子。

您需要在选项对象的 y 和 xAxis 键上设置 'gridLines' 键。

window.onload = function() {

  var ctx = document.getElementById("canvas").getContext("2d");

var barChartData = {
        labels: ["January", "February", "March", "April", "May", "June", "July"],
        datasets: [{
            label: 'Dataset 1',
            backgroundColor: "rgba(151,187,205,0.5)",
            data: [100,99,98,97,96,95,94]
        }]
    };
    
  window.myBar = new Chart(ctx).Bar({
      data: barChartData,
      options: {
          responsive: true,
          scales: {
            xAxes: [{
              gridLines: {
                show: true
              }
            }],
            yAxes: [{
              gridLines: {
                show: false
              }
            }]
          }
      }
  });

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.0-alpha/Chart.min.js"></script>

<div>
  <canvas id="canvas"></canvas>
</div>