4👍
Yes it’s possible. The code below add 10 objects to your dataset.
var LINECHART = $('#lineModal');
window.myLineChart=new Chart(LINECHART,
{
type: 'line',
options: {
elements: {
point:{
radius: 0
}
},
scales: {
xAxes: [{
display: true,
ticks: {
autoSkip: true,
maxTicksLimit: 2,
maxRotation: 0,
minRotation: 0
},
gridLines: {
display: false
}
}],
yAxes: [{
ticks: {
suggestedmax: 13000,
suggestedmin: 13000
},
display: true,
gridLines: {
display: false
}
}]
},
legend: {
display: legendState
}
},
data: {
labels: modalChartDates[0],
datasets: [
{
label: "Asset Price",
fill: true,
lineTension: 0.2,
backgroundColor: "transparent",
borderColor: "rgba(134, 77, 217, 0.57)",
pointBorderColor: "rgba(134, 77, 217, 0.57)",
pointHoverBackgroundColor: "rgba(134, 77, 217, 0.57)",
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
borderWidth: 2,
pointBackgroundColor: "#fff",
pointBorderWidth: 0,
pointHoverRadius: 3,
pointHoverBorderColor: "#fff",
pointHoverBorderWidth: 3,
pointRadius: 0,
pointHitRadius: 5,
data: modalChartData[0],
spanGaps: false
},
{
label: "Moving Average",
fill: true,
lineTension: 0.2,
backgroundColor: "transparent",
borderColor: "rgba(75, 75, 75, 0.7)",
pointBorderColor: "rgba(75, 75, 75, 0.7)",
pointHoverBackgroundColor: "rgba(75, 75, 75, 0.7)",
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
borderWidth: 2,
pointBackgroundColor: "#fff",
pointBorderWidth: 0,
pointHoverRadius: 3,
pointHoverBorderColor: "#fff",
pointHoverBorderWidth: 3,
pointRadius: 0,
pointHitRadius: 5,
data: modalMovingAverageData[0],
spanGaps: false
}
]
}
});
for(let i=0;i<10;i++){
myLineChart.data.datasets.push({
label: "item "+i,
fill: true,
lineTension: 0.2,
backgroundColor: "transparent",
borderColor: "rgba(75, 75, 75, 0.7)",
pointBorderColor: "rgba(75, 75, 75, 0.7)",
pointHoverBackgroundColor: "rgba(75, 75, 75, 0.7)",
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
borderWidth: 2,
pointBackgroundColor: "#fff",
pointBorderWidth: 0,
pointHoverRadius: 3,
pointHoverBorderColor: "#fff",
pointHoverBorderWidth: 3,
pointRadius: 0,
pointHitRadius: 5,
data: modalMovingAverageData[0],
spanGaps: false
});
}
//Use the window object to update myLineChart
window.myLineChart.update();
Based on the official docs and the github repo of Chart.js
Source:stackexchange.com