在Chart.js中，我想要显示如下图所示的点线gridLines

Question

我正在使用chart.js开发一个图表，我想显示图中所示的虚线网格线。

Answer 1

您可以在图表选项中编辑数据集显示：

options: {
    scales: {
        // The following will affect the vertical lines (xAxe) of your dataset
        xAxes: [{
            gridLines: {
                // You can change the color, the dash effect, the main axe color, etc.
                borderDash: [8, 4],
                color: "#348632"
            }
        }],

        // And this will affect the horizontal lines (yAxe) of your dataset
        yAxes: [{
            gridLines: {
                borderDash: [8, 4],
                color: "#348632"
            }
        }]
    }
}

现在您知道该怎么做了，只需按照您希望的方式进行更改即可 检查Chart.js文档上的Grid Line Configuration（向下滚动）以查看可编辑的内容。

如果需要，这里有一个工作示例on this jsFiddle及其结果：