将 SVG 转换为点序列

Question

给定一个 SVG，是否有一个库可以帮助我将文件的任何路径转换为路径上的一系列点，两个连续点之间的路径长度为 1（或其他常数） )?

Answer 1

不需要图书馆。 SVGGeometryElement API 在几行代码中使这成为可能：

function getPointsAlongPath (path, distance) {
  const length = path.getTotalLength();
  const points = [];

  for (let step = 0; step <= length; step = step + distance) {
    points.push(path.getPointAtLength(step));
  }
  
  return points;
}

const result = getPointsAlongPath(document.querySelector('circle'), 5);
console.log(result.map(p => [p.x, p.y]));

<svg width="100" viewBox="0 0 100 100">
  <circle cx="50" cy="50" r="40" fill="none" stroke="black" />
</svg>