Layout Chart.js-折线图最右侧的数据点截断

Layout Chart.js-折线图最右侧的数据点截断,layout,charts,linechart,Layout,Charts,Linechart,使用chart.js 2.8.0版绘制基本折线图。 观察最右边的数据点是否被切断。但最左边的数据点(第一个数据点)看起来完好无损。 我已经通过更改pointRadius的值更改了数据点圆的大小。但即使是最小的值,数据点仍然会被切断 我没有使用任何插件或花哨的设置。我正在用浅灰色背景色填充图表。但除此之外,其他所有内容都是标准的box Chart.js 我在这里重新创建了该问题: 这是我的选项设置 options: { legend: { display: fals

使用chart.js 2.8.0版绘制基本折线图。 观察最右边的数据点是否被切断。但最左边的数据点(第一个数据点)看起来完好无损。

我已经通过更改pointRadius的值更改了数据点圆的大小。但即使是最小的值,数据点仍然会被切断

我没有使用任何插件或花哨的设置。我正在用浅灰色背景色填充图表。但除此之外,其他所有内容都是标准的box Chart.js

我在这里重新创建了该问题:

这是我的选项设置

options: {
      legend: {
        display: false,
      },
      tooltips: {
        callbacks: {
            label: function (tooltipItem, data) {
              var tooltipValue = data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index];
              return "£" + parseInt(tooltipValue).toLocaleString();
          }
      }
      },    
        scales: {
          yAxes: [{ 
                gridLines: {
                  color: "white",
                  lineWidth: 2
                },
                ticks: {
                  beginAtZero: true,
              min: 0,
              stepSize: 500000,
              callback: function(value, index, values) {
              return "£" + value.toLocaleString();
            },
          },
          scaleLabel: {
              display: true,
              labelString: "Median house price"
        }
              }],
            xAxes: [{
              display: false, 
                ticks: {
                    display: false 
                }
            }]
        }
    },

有人见过Chart.js有类似的问题吗

我通过在图表的
右侧添加
填充
值来解决这个问题。 我用准确的数字四处游荡,4号左右看了看我的图表。但我认为正确的数字取决于
点半径的大小和其他变量。
这就是我的变化

options: {
        layout: {
            padding: {
                left: 0,
                right: 4,
                top: 0,
                bottom: 0
            }
        }
    }
有关Chart.js填充的更多信息,请参阅他们的说明页。

真烦人。而且,这应该是一个默认设置,真的。但这解决了我的问题

可以使用偏移量

scales: {
 xAxes: [{
     offset: true
  }]
}