svg - 将 SVG 转换为点序列
问题描述
给定一个 SVG,是否有一个库可以帮助我将文件的任何路径转换为位于路径上的一系列点,两个连续点之间的路径长度为 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>
推荐阅读
- android-studio - 如何将android studio上的相机旋转到肖像模式
- html - For Loop HTML/JS ,每周递减数字
- python-3.x - 添加第 23 行后如何超出范围?
- nginx - 我想通过http进行通信,但它更改为https
- flutter - 当在 Flutter quiz-app 中选择错误答案时,如何在按下按钮时更改按钮的颜色或在下方打印新消息?
- ssl - VerneMQ TLS 配置给出错误握手失败使用letsencrypt
- modelica - 为什么在函数中使用灵活的数组输入会在 OpenModelica 中引发翻译错误?
- swift - 快速传递数据委托和协议
- python - 使用适当格式更改 Tkinter 中的图标时出现问题
- tensorflow - XLA_GPU 在 Tensorflow 中显示而不是 GPU