Question

我正在尝试使用chart.js绘图，在此我基本上想要实现散点线图这里是从chart.js

的文档中获取的示例代码

var scatterChart = new Chart(ctx, {
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'
        }]
    }
}
});

这个示例中只有3个数据点，但在我的情况下，我有大约100个数据点存储在2个数组中，即xArray和yArray。我尝试在函数中使用for循环，但它无法正常工作。有人可以帮忙吗？

编辑：这对我有用。我创建了一个新数组并将对象（x坐标和y坐标）添加到此数组中。这是代码段。

for(var i=0;i<100;i++)
{
    var obj = {x:xFinal[i],y:yFinal[i]};
    c.push(obj);
}

// Note that here c is a variable declared as var c = [];

Answer 1

尝试连接数组，如下所示：

//var xArray = [{x: ?,y: ?}, {x: ?,y: ?}];
//var yArray = [{x: ?,y: ?}, {x: ?,y: ?}];
var concatenatedArray = xArray.concat(yArray);

然后，您可以在调用图表时将其传递出去：

var scatterChart = new Chart(ctx, {
type: 'line',
data: {
    datasets: concatenatedArray
},
options: {
    scales: {
        xAxes: [{
            type: 'linear',
            position: 'bottom'
        }]
    }
}
});

我希望这有帮助 - 让我发布！

如何在chart.js中包含许多数据点

1 个答案: