了解canvas PaperJS 路径JSON 导出

Question

当我导出在 PaperJS 上绘制的路径时，我得到了这个：

["Path",
  {"applyMatrix":true,
  "segments":
    [
      [
        [255, 451.51563],
        [0, 0],
        [0, -2.09596]
      ],
      [
        [255, 439.51563],
        [-1.22916, 1.22916],
        [0.23839, -0.23839]
      ],
      [
        [269, 441.51563],
        [0, -0.70695],
        [0, 0]
      ]
    ],
    "strokeColor":[0, 0, 1]
  }
]

在segments对象中，有由3个数组组成的segments。我知道第一个数组是绘制的连续点的坐标。最后两个数组是什么？

Answer 1

这些是用来绘制路径的不同点。在您的示例中，由于绘制的路径可能很难说明。在一个更简单的示例中，您可以看到第一个点位于 20,20 的 x,y 处，然后第三个点在 x 轴上移动 120 度并在 140,20 处。

额外的用于输入和输出例如：

segments: [
    [[offset, y], null, vector.rotate(-90)],
    [[width / 2, y], vector.rotate(-180), vector],
    [[width - offset, y], vector.rotate(90), null]

http://paperjs.org/reference/path/#path-object

了解canvas PaperJS 路径JSON 导出

Understand canvas PaperJS path JSON export

json

canvas

path

matrix

paperjs