Scaling algorithms not reliant on browser implementation, to workaround missing image-rendering optimize-contrast/nearest-neighbor support in Chrome, causing fuzzy images when scaled up

[deathcap]

Would be a nice enhancement, perhaps for this library (couldn't find anything relevant already on NPM from a quick search)

references:

https://github.com/deathcap/inventory-window/issues/1 http://phrogz.net/tmp/canvas_image_zoom.html https://en.wikipedia.org/wiki/Pixel_art_scaling_algorithms#Pixel_art_scaling_algorithms

[deathcap]

Found this: https://github.com/mikolalysenko/ndarray-downsample2x - but its for sampling down, not up

[deathcap]

http://stackoverflow.com/questions/2670084/canvas-image-smoothing https://news.ycombinator.com/item?id=7241166 claims Chrome does support disabling filtering:

Canvas actually has a context attribute to disable filtering in modern builds of Firefox and Chrome. mozImageSmoothingEnabled/webkitImageSmoothingEnabled, iirc.

[deathcap]

Algorithms for "depixelizing pixel art": http://research.microsoft.com/en-us/um/people/kopf/pixelart/supplementary/multi_comparison.html https://news.ycombinator.com/item?id=7307352 https://pay.reddit.com/r/programming/comments/1zby73/depixelizing_pixel_art/ http://wiki.scummvm.org/index.php/User_Manual/Appendix:_Graphic_filters http://filthypants.blogspot.co.uk/2012/03/xbr-vs-hqx-interpolation-filter.html

[deathcap]

Discussion yesterday on blink-dev shows Chrome might implement 'image-rendering: pixelated':

https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/Q8N6FoeoPXI Intent to implement: image-rendering: pixelated http://dev.w3.org/csswg/css-images/#the-image-rendering

also mentions:

(Note that already has support for nearest-neighbour when drawing images and other canvases into a canvas, via ctx.imageSmoothingEnabled = false, although that's not what the stackoverflow question is about.)

[deathcap]

https://github.com/deathcap/ndarray-upsample-epx