在 paper.js 中沿贝塞尔曲线绘制文本

Question

是否可以使用paper.js轻松沿贝塞尔曲线绘制文本？

我知道可以将文本附加到行路径然后旋转它， 但我对沿曲线绘制文本特别感兴趣。 类似http://www.w3.org/TR/SVG11/images/text/toap02.svg

我知道这可以通过逐个字母打印文本来实现，并对每个项目应用相应的旋转，但我对在 paper.js 中实现这一目标的更简单方法感兴趣

Answer 1

如上一个答案所述，PaperJS 不提供开箱即用的此功能。但是你可以毫不费力地达到效果。

这里是如何进行的：

1. 获取文本中每个字形 x 中心的偏移量。这可以通过使用子字符串的 PointText 的宽度直到字形来完成。
2. 在您希望文本对齐的路径上找到偏移点。
3. 将单个居中字形放置在刚刚找到的点。按路径的切线角度旋转 glph。

这是纸质草图：Align Text to Path Sketch

这是一个简单测试的结果：

您可以在应用旋转之前沿 y 轴移动字形的 PointText 对象以实现与路径的偏移（如示例中的红色文本）。

Answer 2

我们还没有在 Paper.js 中实现沿路径的文本。目前，文本支持还很初级，但是一旦我们推出 1.0 版库，这有望很快改变。