[SOLVED] imagedata seems scaled in canvas

Question

i have this code here
https://code.sololearn.com/WzHiJVbmZpuc/?ref=app
basicly i tried to paint every pixels in red, using ImageData. but after i put the imageData back into canvas, the image is scaled down and strectch. (it looks like this : http://tinyimg.io/i/OUtDwX0.jpg )
width and height of imagedata (and canvas) is in 1:1 ratio, so i dont quite understand why. anyone has explaination or solution for this ?

EDIT: changing createImageData(100,100) to getImageData(0,0,100,100) produce the same result.

Answer 1

solved, it seems i shouldnt resize the canvas from style
so i change

img.style.width to img.width

my mind think its deprecated feature from html4, but silly me canvas was added in html5 😂