如何划分一个多边形点？Pathfinding.js库
如何划分一个多边形点？Pathfinding.js库
提问于 2019-08-14 17:07:09
我有一个这样的形状：
是否可以使用它们的点来划分网格并将其存储在数组中？
<polyline class="st8" points="2022.5,409.3 1996.1,409.3 1996.1,296.8 1970.4,296.8 1970.4,324.4 1920.2,324.4 1920.2,429.3
1667.7,429.3 1667.7,360.5 1631.4,360.5 1631.4,408.5 1445,408.5 1445,362.3 1357.4,362.3 1357.4,408.5 962.3,408.5 962.3,362.3
874.8,362.3 874.8,408.5 721.1,408.5 721.1,362.3 633.6,362.3 633.6,408.5 480,408.5 225.4,408.5 225.4,370 168.9,370 168.9,408.6
113.3,408.6 113.3,512.4 110,512.4 170.4,512.4 170.4,564.9 170.4,595.1 170.4,633.5 191.2,633.5 225.2,633.5 225.2,590.2
225.2,500.5 479.9,500.5 589,500.5 589,546.5 721.4,546.5 721.4,500.5 914.4,500.5 914.7,546.5 986.9,546.5 987,500.5
1398.2,500.5 1398.3,546.5 1470.6,546.5 1470.6,500.5 1660.6,500.5 1660.6,544.9 1723,544.9 1723,500.5 1919.1,500.5 1919.1,511.3
2022.5,511.3 2022.5,409.3 "/>编辑：可以在网格中使用Pathfinding.js吗?我将如何在库中设置setWalkableAt函数？
回答 1
Stack Overflow用户
发布于 2019-08-14 18:00:49
受如何将坐标添加到SVG折线中？中提到SVG DOM的启发，我想到了.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
window.onload = function() {
var polyline= document.getElementById("myPolyline");
var pts = [];
for (var i=0; i < polyline.points.length; i++) {
pts.push([polyline.points[i].x, polyline.points[i].y]);
}
console.log(pts);
}
</script>
</head>
<body>
<svg width="1920" height="340">
<polyline id="myPolyline" class="st8" points="2022.5,409.3 1996.1,409.3 1996.1,296.8 1970.4,296.8 1970.4,324.4 1920.2,324.4 1920.2,429.3
1667.7,429.3 1667.7,360.5 1631.4,360.5 1631.4,408.5 1445,408.5 1445,362.3 1357.4,362.3 1357.4,408.5 962.3,408.5 962.3,362.3
874.8,362.3 874.8,408.5 721.1,408.5 721.1,362.3 633.6,362.3 633.6,408.5 480,408.5 225.4,408.5 225.4,370 168.9,370 168.9,408.6
113.3,408.6 113.3,512.4 110,512.4 170.4,512.4 170.4,564.9 170.4,595.1 170.4,633.5 191.2,633.5 225.2,633.5 225.2,590.2
225.2,500.5 479.9,500.5 589,500.5 589,546.5 721.4,546.5 721.4,500.5 914.4,500.5 914.7,546.5 986.9,546.5 987,500.5
1398.2,500.5 1398.3,546.5 1470.6,546.5 1470.6,500.5 1660.6,500.5 1660.6,544.9 1723,544.9 1723,500.5 1919.1,500.5 1919.1,511.3
2022.5,511.3 2022.5,409.3 "/>
</svg>
</body>
</html>请注意，我为polyline提供了一个id属性，以便于使用document.getElementById()获得对它的引用。
在浏览器开发工具的控制台中查看数组。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/57499155
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号