如何在折线图中添加第二条数据线:
var config = {
type: "line",
data: {
labels: ["28/01/2018 15:07:34", "28/02/2018 12:31:27", "28/05/2018 01:21:28", "27/10/2018 01:21:28", "28/11/2018 05:09:28"],
datasets: [{
label: "title",
backgroundColor: "transparent",
borderColor: "#000",
data: [65, 76, 32, 54, 43]
}]
},
options: {
elements: {
line: {
tension: 0
}
},
responsive: true,
scales: { },
}
};
var myChart = new Chart(ctx, config);
包含数据:
labels: ["28/01/2018 15:07:34", "28/05/2018 01:21:28", "27/10/2018 01:21:28" ], data: [50, 50, 50, 50, 50]
我还希望点之间的线条具有红色,黑色,红色,黑色。我不知道该怎么做。
谢谢你的帮助
在 Chart js 的 3.2.1 版本中;
myChart.data.datasets[myChart.data.datasets.length] = {
label: "",
xAxisID: "x-axis-2",
data: newDataArray.map((val, index) => {x: labels[i], y: val}),
fill: false,
backgroundColor: "",
borderColor: "",
borderWidth: 1
}
myChart.update();
如果您知道正在使用的特定数据集(行)数量,则可以设置myChart.data.datasets.length
。
如果你想内
联执行此操作(你已经有了数据),你可以这样把它添加到"数据集"中:
data: {
labels: ["28/01/2018 15:07:34", "28/02/2018 12:31:27", "28/05/2018 01:21:28", "27/10/2018 01:21:28", "28/11/2018 05:09:28"],
datasets: [{
label: "title",
backgroundColor: "transparent",
borderColor: "#000",
data: [65, 76, 32, 54, 43]
},{
label: "title2",
backgroundColor: "transparent",
borderColor: "#000",
data: [50, 50, 50, 50, 50]
}]
},
如果要在事后添加数据,请将数据集推送到数据数组上,如下所述:https://www.chartjs.org/docs/latest/developers/updates.html
function addData(chart, label, data) {
chart.data.labels.push(label);
chart.data.datasets.forEach((dataset) => {
dataset.data.push(data);
});
chart.update();
}