如何去除折线图上每个点顶部的线 (Chart.js)

Question

我正在使用 Chart.js 并创建折线图。我似乎无法摆脱每个图表坐标上方的线。见下图。我需要更改哪个设置才能摆脱它们？谢谢

这是图表变量的样子

var chart = new Chart(chartx, {
  type: 'line',
  data: {
    labels: labels,
    datasets: [{
      data: data,
      fill: false,
      borderColor: 'rgb(0,0,0)', 
      borderWidth: 1,
      lineTension: 0,
      pointStyle: 'dash'
    }]
  },
        options: {
    responsive: true,
    maintainAspectRatio: true,
    animation: false, 
            scales: {
                xAxes: [{
                    display: false
                }],
                yAxes: [{
                    display: false
                }]
    },
            legend: {
                display: false,
            }
    },
});

Answer 1

这是因为您在数据集属性中添加了 pointStyle: 'dash'。

参见Chart.js doc关于LineChart数据结构（pointStyle在table的最后一行）：

The style of point. Options are 'circle', 'triangle', 'rect', 'rectRot', 'cross', 'crossRot', 'star', 'line', and 'dash'. If the option is an image, that image is drawn on the canvas using drawImage.

您必须在不同的选项之间做出选择。

请注意，没有 none 选项。

如果要去掉点样式，可以:

将数据集的 pointRadius 属性设置为 0（如 this fiddle).
导入块引用第二部分中所述的图像，该图像为空（如 this one）。

如何去除折线图上每个点顶部的线 (Chart.js)

How to get rid of the line on top of every point on a line chart (Chart.js)

linegraph

chart.js