gpt4 book ai didi

javascript - 围绕传单 map 中的点旋转多边形

转载 作者:行者123 更新时间:2023-11-30 07:58:10 25 4
gpt4 key购买 nike

我有一个问题,在我的传单 map 中,我从多边形创建了一个三 Angular 形:

var polygon = L.polygon([ 
[parseFloat(decimal_lat),parseFloat(decimal_lon)],
[parseFloat(decimal_lat) + 1, parseFloat(decimal_lon) - 1],
[parseFloat(decimal_lat) + 1, parseFloat(decimal_lon) + 1] ],
{
color:'green'
});
polygon.addTo(map);

我想围绕 Point[decimal_lon, decimal_lat] 旋转这个多边形。但是我无法解决它..
我创建了 DEMO ,我旋转多项式的地方我想旋转我的三 Angular 形(多边形)来向你展示我的问题。

最佳答案

一种方法是通过矩阵旋转。 https://en.wikipedia.org/wiki/Rotation_matrix .您想要将点平移到中心然后应用旋转,然后将其平移回来。

这就是代码的结尾。

  //changing polyline with slider but I want to change polygon there
range_yaw.onchange = function() {
var yawAngle = (parseFloat(range_yaw.value) / (819 / 360) + 90)
// line
var center = [decimal_lat, decimal_lon]
var end = [decimal_lat + 2, decimal_lon + 2]
var pointListRotated = rotatePoints(center, [center, end], yawAngle)
polyline.setLatLngs(pointListRotated);
// polygon
var polygonPoints = [
center,
[center[0] + 1, center[1] - 1],
[center[0] + 1, center[1] + 1]
]
polygonRotated = rotatePoints(center, polygonPoints, yawAngle)
polygon.setLatLngs(polygonRotated)
};

//
// rotate a list of points in [lat, lng] format about the center.
//
function rotatePoints(center, points, yaw) {
var res = []
var angle = yaw * (Math.PI / 180)
for(var i=0; i<points.length; i++) {
var p = points[i]
// translate to center
var p2 = [ p[0]-center[0], p[1]-center[1] ]
// rotate using matrix rotation
var p3 = [ Math.cos(angle)*p2[0] - Math.sin(angle)*p2[1], Math.sin(angle)*p2[0] + Math.cos(angle)*p2[1]]
// translate back to center
var p4 = [ p3[0]+center[0], p3[1]+center[1]]
// done with that point
res.push(p4)
}
return res
}

这是一个DEMO

关于javascript - 围绕传单 map 中的点旋转多边形,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34967607/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com