Open joedf opened 2 years ago
Impressive work! However, it looks blurry on a 4k screen. I think this may be related to #14 and could resolve it. https://www.html5rocks.com/en/tutorials/canvas/hidpi/
I had this issue with software I was working, and this is the simplest solution I ended up using.
this.canvas.width = e.width * window.devicePixelRatio; this.canvas.height = e.height * window.devicePixelRatio; this.canvas.getContext("2d").setTransform(window.devicePixelRatio, 0, 0, window.devicePixelRatio, 0, 0);
Essentially, you render it in the canvas at double resolution (using a transform, double the size of the document element) and scale the document element down to the desired size.
Or even easier, you can just include a polyfill like this one: https://github.com/jondavidjohn/hidpi-canvas-polyfill
Impressive work! However, it looks blurry on a 4k screen. I think this may be related to #14 and could resolve it. https://www.html5rocks.com/en/tutorials/canvas/hidpi/
I had this issue with software I was working, and this is the simplest solution I ended up using.
Essentially, you render it in the canvas at double resolution (using a transform, double the size of the document element) and scale the document element down to the desired size.
Or even easier, you can just include a polyfill like this one: https://github.com/jondavidjohn/hidpi-canvas-polyfill