I am using chart.js line chart to show some graph for my data of resource usage for say a particular period where period may vary like last one day, last one week, last one month and so on.. I am using line chart and the code is as below.
Basically I want my canvas to get resized according to the period selected in my dropdown. Say if i select 1 day, the canvas shuld be shrinked to display one day data, I mean if I have to display data for one month, width of my canvas should be 100% (data should be shown in entire canvas) , one week canvas should shrink to say 25% of the whole canvas(data should be shown in 25% of the canvas) and for one day width should be 10% of canvas.
If someone is aware of how this has to be achieved using chart.js, would be helpful
var myData = { labels: timeX, datasets: [{ data: percentageY }] };
MEMORY_LINE_CHART = new Chart(ctx, {
type: 'line',
data: myData,
options: {
bezierCurve: false ,
scaleIntegersOnly: false,
animation : false,
responsive: true,
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}],
xAxes: [{
ticks: {
display:true
}
}]
} // scales
}
});