The canvas should have a width equal to the whole image, but it’s half width and height for some reason?
The canvas seems to have wrong scaling behavior on my mobile phone too
The canvas should have a width equal to the whole image, but it’s half width and height for some reason?
The canvas seems to have wrong scaling behavior on my mobile phone too
When you create a canvas context via DOM.context2d() and leave out the third argument, it will scale the canvas to whatever the current devicePixelRatio is (by setting both a style and applying a canvas transform).
Your use of putImageData() is not affected by any transforms and thus will only use the unscaled dimensions.
You can work around that by either passing “1” (e.g. DOM.context2d(w, h, 1)) or by using ctx.canvas.width and ctx.canvas.height in your pixel operations.
reminds me I had a color version lying around too!
now published at https://observablehq.com/@fil/linde-buzo-gray-rgb-color-stippling
Somewhat related, here are some random pixel sampling experiments:
Cool! I’ll link to your notebook too