Canvas and Image problem (when using stroke / lines)

[driv3l]

Hi,

I've been struggling with this issue for a while now... I've looked at the Canvas tutorials and specs muliple times, but cannot find a solution to my problem.

I am putting an image directly onto the canvas using ctx.drawImage(img, 0, 0, width, height, scalewidth, scaleheight). I have already drawn rectangles and / or lines onto the canvas using strokeRect and moveTo and lineTo.

The behavior I want is for the image I draw to hide / overwrite any lines drawn under it. However, this does not seem to happen. I consistently get the lines showing over the image I am drawing. The image is fully opaque (no transparency set).

I have tried setting the globalCompositeOperation to "copy" whenever I draw the image, but this has no effect.

I have also tried alternate approaches like doing a clearRect() in the location I am planning on drawing the image, however, when I do a clearRect() and then do a drawImage(), when I run it in the browser, I can see the image being drawn, but then it is immediately cleared (almost like drawImage is rendering before clearRect).

I am totally flustered by how to get this working properly.

Any help would be greatly appreciated!!!

Btw, I'm testing this on Chrome (tried it on IE and Firefox as well and get the same behavior).

Thanks!

[zcorpan]

Would be helpful if you showed us the code