Tips: 关于HTML5 canvas中绘图方法的坐标参数.

HTML5 canvas 有很多绘图相关的方法,例如画线画矩形等等.

其中绝大多数都接收"坐标"参数. 当你传入浮点数时, canvas内部会对他们进行 Math.round(四舍五入)操作,取整之后再进行绘制.

注意: 这里和传统dom中定位坐标不一样,dom中是直接取整的.

例如:

dom中

div.style.top="2.1px";
div.style.top="2.9px";

最后显示时 div的top都是2px.

而canvas中

context.drawImage(img, 10 , 2.1);
context.drawImage(img, 10 , 2.9);

一个的y坐标是2 一个y坐标是3.