javascript - KineticJS strokeWidth 居中

Question

当您在 Kinetic 中使用 strokeWidth 时，它会在实际点的每一侧添加宽度。因此，换句话说，笔划以通常为 1px 的线为中心，并且该线的宽度从中心向外增长。

因此，例如在下图“A”中，您会看到该点位于 (0,0) 处，但线从该点向外增长。我需要的是图像“B”之类的东西。

我知道我可以通过仅通过 strokeWidth 的差异来扩大多边形来实现这一点，但这会引发许多测量，我希望有一些更容易说“向外生长”的东西。

Answer 1

居中对齐是唯一的原生 html 画布笔画对齐方式。

偶尔会建议在“中”给出笔画 | “出” | “中心”对齐，但到目前为止，whatWG 没有：http: //old.nabble.com/Canvas-stroke-alignment-tc29205720.html

你可以把你的多边形放在一个自定义的动力学形状中。这样，您可以在原始多边形之外绘制第二个“抚摸”多边形。这是更多的设置工作，但您可以达到您想要的结果。