[Discussion] Automatic pixel ratio

[GrandSchtroumpf]

Hello, I'm working on the bubble.io plugin and Guido asked me to support retina display. I can implement it in the bubble.io plugin, but I thought it would be better to a PR on rive.js directly. I'm thinking about adding something like that :

const { width, height } = canvas.getBoundingClientRect();
const scale = window.devicePixelRatio;
canvas.width = Math.floor(width * scale);
canvas.height = Math.floor(height * scale);

Do you think it's something that should be integrated directly in rive.js ?

[zplata]

@GrandSchtroumpf Late reply here - but on the Rive class, we've exposed a new method:

resizeDrawingSurfaceToCanvas()

You can invoke this manually if you have set width and height attributes on the <canvas> element. Otherwise, this gets called automatically at instantiation if you haven't set the width or height attributes. Useful in case you may have set the sizing with CSS instead.

[zplata]

Closing - but feel free to reopen if this is still a concern for you, and the above solution doesn't help!

[GrandSchtroumpf]

Hello @zplata I couldn't find the resizeDrawingSurfaceToCanvas neither as a method nor as a static method of the Rive class. I'm using @rive-app/[email protected] Here are the available methods from the Rive instance. Though maybe I'm not looking at the right place...