[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
Re: [Public WebGL] How to unambiguously set canvas pixel size to be pixel-perfect?
This is an issue I'm struggling with too. There aren't any problems with framebuffer size in my case though. I'm trying to cover most of the screen with a WebGL canvas and that area has the same number of physical pixels regardless of zoom level (well, it's really a little less after you zoom in because the UI around the canvas grows in size a bit).
DPI handling works by setting the canvas width/height to the CSS width/height times the devicePixelRatio, so the canvas framebuffer is approximately scaled 1:1 with physical pixels. For fullscreen WebGL apps, zooming in makes the window size go down and the devicePixelRatio go up to match.
The problem is that CSS only lets you set the canvas size to integer values, and most of the time it's impossible to specify an integer width/height such that the zoomed canvas is exactly the size you need. Demo showing the problem: http://fiddle.jshell.net/V884T/show/
(zoom in and the grid won't match 1:1).
Strawman API proposal: add a "scaled: false" parameter to the WebGL context creation attributes that would always render the framebuffer from the top left corner at 1:1 with physical pixels (i.e. not scaled) without affecting the size of the canvas element itself.
On Tuesday, June 10, 2014, Rik Cabanier <email@example.com