在画布上书写垂直文本

Question

帆布：

y
a
x
i
s 
 x axis

如何在画布上垂直书写？例如：文本yaxis。

Answer 1

没有内置的方法，因此您必须设计一个解决方案。我会编写一个函数，它接受字符串和字符之间的空格，然后打印每个字符，增加垂直位置。

另一种更简单的方法是将画布旋转 90 度，然后绘制文本，但这可能不是您想要的。

示例代码（来自codepen）：

CanvasRenderingContext2D.prototype.fillVerticalText = 
  function(text, x, y, verticalSpacing) {
    for (var i = 0; i < text.length; i++) {
      this.fillText(text[i], x, y + i * verticalSpacing);
    }
  }