javascript - html5 画布不会在坐标 (0,0) 处填充文本

Question

为什么画布不为任何东西做任何事情fillText(text, 0,0)但为它工作fillText(text, 10, 10)？

fillText(text, 0,0): http://jsfiddle.net/kFhQm/4/

fillText(text, 10, 10): http://jsfiddle.net/kFhQm/5/

Answer 1

第二个参数是文本基线的 Y 坐标（默认textBaseline为"alphabetic"），因此当您使用 时，文本将绘制在可见元素上方。canvas0

js小提琴。

您可以使用不同的数字，或者将textBaseline属性更改为合适的值，例如"top".

ctx.textBaseline = "top";

js小提琴。