Chart.js v2 - 隐藏网格线

I am using Chart.js v2 to draw some simple Line Charts. Everything works fine apart from those Grid Lines:

我使用Chart.js v2绘制一些简单的折线图。除了那些Grid Lines之外，一切都很好：

The documentation for Line Chart is there: https://nnnick.github.io/Chart.js/docs-v2/#line-chart, but I can't find anything about hiding those "Grid Lines" there.

折线图的文档在那里：https：//nnnick.github.io/Chart.js/docs-v2/#line-chart，但我找不到任何关于隐藏那些“网格线”的信息。

Can someone help me? Thank you.

有人能帮我吗？谢谢。

3 个解决方案

#1

147

I found a solution, this is works for me at the Line chart. Set the same gridLines color as the div's background color.

我找到了一个解决方案，这对我在折线图上有用。将相同的gridLines颜色设置为div的背景颜色。

var options = {
scales: {
    xAxes: [{
                gridLines: {
                    color: "rgba(0, 0, 0, 0)",
                }
            }],
    yAxes: [{
                gridLines: {
                    color: "rgba(0, 0, 0, 0)",
                }   
            }]
    }

or use

或使用

 var options = {
scales: {
    xAxes: [{
                gridLines: {
                    display:false
                }
            }],
    yAxes: [{
                gridLines: {
                    display:false
                }   
            }]
    }

#2

OK, nevermind.. I found the trick:

好的，没关系..我找到了诀窍：

    scales: {
      yAxes: [
        {
          gridLines: {
                lineWidth: 0
            }
        }
      ]
    }

#3

If you want them gone by default, you can simply set:

如果你想让它们在默认情况下消失，你可以简单地设置：

Chart.defaults.scale.gridLines.display = false;

#1

147