3 ms·
Just dealt with some of these issues last week in 7drl. >image-rendering: optimizeSpeed; In some cases, you will want to scale the images drawn to the canvas,
by jere 14y ago
Just dealt with some of these issues last week in 7drl.
>image-rendering: optimizeSpeed;
In some cases, you will want to scale the images drawn to the canvas, but not the canvas itself. This causes a lot of headache because of image smoothing and is not resolved by the above CSS. The answer is to set the image smoothing property of the canvas context to false. For example:
ctx.mozImageSmoothingEnabled = false;
ctx.webkitImageSmoothingEnabled = false;
Worked great on Chrome and Firefox. For some reason, though, this does not appear to work in Safari. I'm still amazed that something so simple is so hard to accomplish across browsers (after all you're asking to turn off extra, slower functionality). A good article on the intricacies: http://phoboslab.org/log/2012/09/drawing-pixels-is-hard http://phoboslab.org/log/2012/09/drawing-pixels-is-hard
- jlongster 14y agoI had forgotten about those js properties, thanks. If you do that, and scale your graphics with setScale instead, I think that is the best option. I plan on tweaking this article with improvements like that.