[Chartjs]-React chart : prevent chart's canvas scaling with height and width

12👍

✅

In my case, setting
maintainAspectRatio:false along with supplying height/width on div

<div style={{height:'100px',width:'200px'}}>
<HorizontalBar data={data} options={chartOptions}/>
</div>

helped in restricting the canvas’s scalability.

3👍

Try setting responsive: false in your options object. That should according to the documentation make so that the canvas doesn’t resize (https://www.chartjs.org/docs/latest/general/responsive.html#configuration-options)

1👍

According to version 5.2.0 you can do it in the following way,

<HorizontalBar
  style={{
    width: 750,
    height: 400,
  }}
  options={{
    maintainAspectRatio: false,
  }}
/>