How to use pure black on Images
It may be a silly question, but when drawing on an image, it does not show a perfect black.
This can be seen if we overlay a sprite with the same color.
It may be a silly question, but when drawing on an image, it does not show a perfect black.
This can be seen if we overlay a sprite with the same color.
This has to do with how the html canvas draws lines unfortunately. The lines are not drawn ON pixels, but rather BETWEEN them. You should position your lines and shapes on half-pixel coordinates to mitigate this. For example, use image = new Image(33,33), and image.drawRect(0.5,0.5,32,32) to ensure a 32 pixel drawing fits within a 33 pixel image, and try drawing that to the screen. It should appear black if the line width is an odd number. This isn't a microstudio issue, its an html canvas api design choice.
That solved it, thank you very much!