Chart.js reduce canvas size without changing the size of the chart

Question

I have a radar chart with the following canvas properties:

ctx.canvas.width = 600;
ctx.canvas.height = 550;

The chart displays fine but the canvas seems too large as the chart has a lot of white space around it. I have tried reducing the size of the canvas but this reduces the size of the chart which I do not want.

Any advice?

Regards,

Sarah

Does this answer your question? [Charts.js graph not scaling to canvas size](https://stackoverflow.com/questions/38512001/charts-js-graph-not-scaling-to-canvas-size) — DaveL17, Aug 25 '22 at 23:28

score 1 · Answer 1 · answered May 30 '18 at 18:30

1

You have to set responsible to false, per this SO duplicate question / answer: https://stackoverflow.com/a/43281488/3589609

 options: {
                responsive: false
            }

answered May 30 '18 at 18:30

Joshua Schlichting

3,110
6
28
54

score 0 · Answer 2 · answered Jan 05 '15 at 17:21

0

Why don't you initialize the canvas with smaller dimensions then?

<canvas id="myChart" width="400" height="400"></canvas>

answered Jan 05 '15 at 17:21

rukimira

66
5

Chart.js reduce canvas size without changing the size of the chart

2 Answers2