Chart.js v2-隐藏网格线 [英] Chart.js v2 - hiding grid lines

问题描述

我正在使用Chart.js v2绘制简单的折线图.一切看起来都很好，除了我不想要的网格线:

I am using Chart.js v2 to draw a simple line chart. Everything looks fine, except there are grid lines that I don't want:

折线图文档位于此处: https://nnnick.github.io/Chart.js/docs-v2/#line-chart ，但我找不到隐藏这些网格线"的任何内容.

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

如何删除网格线?

推荐答案

我找到了一种可在折线图中隐藏网格线的解决方案.

I found a solution that works for hiding the grid lines in a Line chart.

将 gridLines 颜色设置为与div的背景颜色相同.

Set the gridLines color to be the same as the div's background color.

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

或使用

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

这篇关于Chart.js v2-隐藏网格线的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！