Question

我用高斯曲线创建直方图，但是曲线的第一个数据点被跳过了。

我的例子：

var ctx = document.getElementById("myChart");
var myChart = new Chart(ctx, {
type: 'horizontalBar',
data: {
    labels: [0,1,2,3,4,5,6,7,8,
            9,10,11,12,13,14,15],
    datasets: [{
        borderWidth: 1,
        backgroundColor: 'rgba(255, 99,                               132,0.5)',
        borderColor: 'rgb(255, 99, 132)',
        data: [3,1,0,0,0,2,0
              ,2,0,2,0,0,0,0,0,0]
    },{
      type: 'line',
      fill: false,
      borderWidth: 1,
      data: [
{
"x": 0.4175611241375584,
"y": 0
},
{
...other points
}
],
      borderColor: 'rgb(54, 162, 235)',
      radius: 2
    }]
},
options: {
    scales: {
        yAxes: [{
           categoryPercentage : 1,
           barPercentage: 1
        }],
        xAxes: [{
          type: 'linear',
          position: 'bottom',
          ticks: {
            stepSize: 1,
            min: 0,
            max: 4
          }
        }]
    }
}
});

https://codepen.io/krna/pen/ejzqwg

当我仅绘制高斯曲线时，所有点均正确绘制。

直方图反转无济于事。

我用数据和图表轴配置尝试了许多奇怪的技巧，但没有成功。

Answer 1

问题出在y轴上的0值上，它可能被解释为null而不是0。但是，可以通过将标签和y值设置为字符串来完成此工作。完整答案您可以在https://github.com/chartjs/Chart.js/issues/5641上找到。

如何在chart.js中的直方图上绘制高斯曲线？

1 个答案: