Chart.js xAxis 线性比例:奇怪的行为

2022-01-22 00:00:00 javascript chart.js

我正在尝试在我的 chart.js 图表中的 x 轴上使用线性刻度.我添加了一些代码，因为 stackoverflow 在添加 jsfiddle url 时必须这样做，但我不明白这一点:

I'm trying to use linear scale on x-axis in my chart.js chart. I add some code beause stackoverflow makes it obligatory when adding a jsfiddle url, but I don't see the point :

var options={
    scales:{
    xAxes:[{ type: "linear"}]
  }
};

我得到一张非常奇怪的图表(第二张):http://jsfiddle.net/t0krmau8/

I'm getting a very strange chart (2nd one) : http://jsfiddle.net/t0krmau8/

在第一个图表中，我希望在 2 和 4 之间获得更多空间(比 1 和 2 之间的空间多 2 倍)，这就是我使用线性刻度的原因.

In the first chart, I'd like to get more space between 2 and 4 (2 times more space than between 1 and 2), that's why I'm using a linear scale.

我是否使用了错误的线性刻度?还是我应该使用其他东西?

Am I using the linear scale wrong? Or should I use something else?

谢谢

推荐答案

您没有为 scatter line 图提供正确格式的数据.

You're not providing the data in correct format for the scatter line plot.

以下来自 Chart.js Docs 的示例描述了提供数据的正确格式.

The correct format to provide the data is described by the following example from Chart.js Docs.

var scatterChart = new Chart(ctx/* your canvas context*/, {
 type: 'line',
    data: {
        datasets: [{
            label: 'Scatter Dataset',
            data: [{
                x: -10,
                y: 0
            }, {
                x: 0,
                y: 10
            }, {
                x: 10,
                y: 5
            }]
        }]
    },
    options: {
        scales: {
            xAxes: [{
                type: 'linear',
                position: 'bottom'
            }]
        }
    }
});

来源

我认为 x 和 y 应该可以分离成不同的数组，但你总是可以做一个组合步骤，将它们组合成对象.

I think the x and y should be separable into different arrays, but you can always do a combination step and combine them into objects.

相关文章