KonvaJS中对象的模式重复

Question

有没有办法通过用户输入在KonvaJS中重复模式？我有这个(演示)。然而，我很难把我的头绕在下一步。有可能吗？

编辑:我想以编程的方式根据用户输入复制/重复每个跨度的弧峰值，并沿着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