Chart.js (v3) issue 3694
HTML
<script src="https://www.chartjs.org/dist/master/chart.js"></script>
<div class="small">
<canvas id="small" width="100%" height="100%"></canvas>
</div>
<div class="large">
<canvas id="large" width="100%" height="100%"></canvas>
</div>
CSS
.small {
height: 185px;
width: 185px;
border: 1px solid red;
}
.large {
height: 165px;
width: 382px;
border: 1px solid red;
}
JavaScript
const config = {
type: 'line',
data: {
labels: [
"Aaron",
"Adam",
"Albert",
"Alex",
"Allan",
"Aman",
"Anthony",
"Autoenrolment",
"Avril",
"Bernard"
],
datasets: [{
backgroundColor: "rgba(252,233,79,0.5)",
borderColor: "rgba(252,233,79,1)",
borderWidth: 1,
data: [101,
185,
24,
311,
17,
21,
462,
340,
140,
24
]
}]
},
options: {
maintainAspectRatio: false
}
};
new Chart('small', config);
new Chart('large', config);