Internet‎ > ‎Google‎ > ‎Google Web Toolkit‎ > ‎

Draw Single Pixel Line in HTML5 or GWT Canvas

Drawing a single pixel line in HTML 5.0 Canvas using GWTCanvas class

canvas.setLineWidth(1) ;
canvas.strokeRect(x-0.5, y-0.5, w, h) ; // (X, Y, Width, Height)

0.5 has to be subtracted from x and y. HTML 5.0 draws strokes in an interesting way which is not found in normal Java Canvas. If we give whole number x i.e. say x = 10 then it will draw at pixel 9 and 10 with opaqueness of 0.5. The output will be a 2 pixel width line of a lighter shade then the one you have set. This is something which is new if you are migrating from Java. If you want to set line at pixel 10 then put the line at pixel 9.5.