KonvaJS 中的线、路径和形状类有什么区别？

Question

我是 PaperJS 的忠实粉丝，但是，该库没有看到太多活动，因此我们正在寻找其他工具，如 KonvaJS、Fabric 和 Pixi。 我们想在这里复制这个例子：

http://paperjs.org/examples/path-simplification/

在 KonvaJS 中，但我们不确定哪个 class 最合适？ 我们应该使用被描述为具有张力的点的集合的线，我们在 Paper 中使用的路径工具，还是形状 class？ KonvaJS 是否提供与上述论文示例中相同类型的贝塞尔曲线工具和形状边框、蓝线的访问权限？

Answer 1

Konva.Line 需要将 x 和 y 列表作为简单数组传递到其点属性中，然后绘制连接这些点的直线。 张力属性可用于使直线连接更弯曲。

Konva.Path 希望您提供一个更像是 SVG 绘图指令列表的数据属性，例如 move、l.neto、arc 等。（请参阅 Konva 文档中支持的指令列表以获取 Konva.Path.data here ）

没有与您链接到的演示中的功能等效的内置路径编辑功能 - 因此路径控制点上没有自动锚点，也没有贝塞尔曲线图柄。 你将不得不自己动手做那些。 话虽如此，这一切都是可以实现的——我的意思是绘制控件锚点和线条，监听鼠标和拖动事件，最后将 SVG 绘图数据传回 Konva.Path 形状，当路径是Konva 很好地支持编辑模式结束。

截至 2022 年 5 月，Konva 库得到了很好的支持，频率适当（正如 Goldilocks 所希望的那样——不要太多也不要太少），没有经过深思熟虑的重大更改，问题得到了回应，SO 帖子得到了回复，并且Discord 频道忙。