canvas绘制文字问题答案

【问题标题】：canvas draw text problemcanvas绘制文字问题
【发布时间】：2010-07-15 20:43:30
【问题描述】：

如果我执行以下代码，则文本显示错误（似乎没有别名）并且未右对齐为什么？

context.textBaseline = "top";
context.textAlign = "right";
context.fillStyle = "#F00";
context.font = "italic 30tpx sans-serif";
context.fillText("Lorem ipsum dolor sit amet", 50, 50);

我正在使用 FF 3.6...

【问题讨论】：

标签： text html canvas

【解决方案1】：

我认为 Firefox 不知道您所说的“30tpx”是什么意思，并且忽略了您的风格。此外，如果您向右对齐，大部分文本将离开屏幕左侧——也许您的意思是向右对齐？试试这个

  contexto.textAlign = "left";
  contexto.fillStyle = "#F00";
  contexto.font = "italic 30px sans-serif";

【讨论】：

它是 30px，在代码中我写对了...谢谢，但是它不起作用...我不明白为什么如果我将文本向右对齐它会超出屏幕（在左边）！

【解决方案2】：

当你向右对齐时，它会从右到左绘制文本，文本在 x 坐标处结束。

你看看这个example 你可以看到不同的文本对齐设置是如何相对于 x 坐标绘制文本的。我也包含了你的代码。

【讨论】：