Chart.js v2 - скрытие линий сетки

Я использую Chart.js v2, чтобы нарисовать простую линейную диаграмму. Все выглядит хорошо, за исключением линий сетки, которые мне не нужны:

Документация по линейной диаграмме находится здесь: https://nnnick.github.io/Chart.js/docs-v2/#line-chart, но я не могу найти ничего о сокрытии этих "линий сетки".

Как я могу удалить линии сетки?

Ответ 1

Я нашел решение, которое работает для сокрытия линий сетки в линейном графике.

Установите цвет gridLines таким же, как цвет фона div.

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
            }   
        }]
    }
}

Ответ 2

Если вы хотите, чтобы они исчезли по умолчанию, вы можете просто установить:

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

Ответ 3

options: {
    scales: {
        xAxes: [{
            gridLines: {
                drawOnChartArea: false
            }
        }],
        yAxes: [{
            gridLines: {
                drawOnChartArea: false
            }
        }]
    }
}

Ответ 4

Хорошо, неважно.. Я нашел трюк:

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

Ответ 5

Если вы хотите скрыть линии сетки, но хотите показать yAxes, вы можете установить:

yAxes: [{...
         gridLines: {
                        drawBorder: true,
                        display: false
                    }
       }]