Skip to content

Commit 5414702

Browse files
committed
Use integer canvas dimensions
As a result of chartjs#12097, the HTMLCanvasElement's `width` and `height` (which are always integers - see [MDN][1]) may be compared to fractional `deviceWidth` and `deviceHeight`, resulting in extra resize and update events being fired. This PR rounds the dimensions for purposes of comparing to the canvas element's, which should put the behavior closer to Chart.js 4.5.0 and earlier. I've tested this against chartjs#11224 and against my own code (which was generating errors due to an interaction between these extra events and some internal plugins), and it seems to work, but other testing and feedback is welcome. [1]: https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement#instance_properties
1 parent e8c58da commit 5414702

File tree

1 file changed

+6
-4
lines changed

1 file changed

+6
-4
lines changed

src/helpers/helpers.dom.ts

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -227,12 +227,14 @@ export function retinaScale(
227227
canvas.style.width = `${chart.width}px`;
228228
}
229229

230+
const canvasHeight = Math.floor(deviceHeight);
231+
const canvasWidth = Math.floor(deviceWidth);
230232
if (chart.currentDevicePixelRatio !== pixelRatio
231-
|| canvas.height !== deviceHeight
232-
|| canvas.width !== deviceWidth) {
233+
|| canvas.height !== canvasHeight
234+
|| canvas.width !== canvasWidth) {
233235
(chart as PrivateChart).currentDevicePixelRatio = pixelRatio;
234-
canvas.height = deviceHeight;
235-
canvas.width = deviceWidth;
236+
canvas.height = canvasHeight;
237+
canvas.width = canvasWidth;
236238
chart.ctx.setTransform(pixelRatio, 0, 0, pixelRatio, 0, 0);
237239
return true;
238240
}

0 commit comments

Comments
 (0)