KonvaJS中对象的模式重复

Question

有没有办法通过用户输入在 KonvaJS 中重复一个模式？我有这个（DEMO）。但是，我很难理解下一步。有可能吗？

编辑：我想根据用户输入以编程方式克隆/重复每个跨度的弧峰，并将其沿 x 轴平铺。

Answer 1

你可以这样做：

const lines = [];
  for (var i = 0; i < numArchPeaks; i++) {
    const single = [0, 0, 90, -50, 180, 0];
    const perSpan = single.map((x) => x / numArchPeaks);
    lines.push(
      <Line x={x + i * 180 / numArchPeaks} y={y} points={perSpan} tension={1} stroke="black" />
    );
  }

// then in render:
<Layer>{lines}</Layer>

https://codesandbox.io/s/stupefied-fermi-vz9z7?file=/src/KonvaExample.js