Google maps api 3 google maps api v3将多边形旋转一定程度
我使用google maps允许用户绘制多边形,然后使用maps API和某种几何图形绘制以16度角覆盖绘制多边形的最小有界正方形,即有界正方形应约束整个多边形区域,并应相对于y轴旋转16度 非常感谢你的帮助Google maps api 3 google maps api v3将多边形旋转一定程度,google-maps-api-3,rotation,polygon,Google Maps Api 3,Rotation,Polygon,我使用google maps允许用户绘制多边形,然后使用maps API和某种几何图形绘制以16度角覆盖绘制多边形的最小有界正方形,即有界正方形应约束整个多边形区域,并应相对于y轴旋转16度 非常感谢你的帮助 这是一个复杂的问题。我可以概括一下让您实现这一目标的主要步骤: 解决方案大纲 获取贴图投影(map.getProjection())并使用projection.fromLatLngToPoint将用户多边形转换为点平面 将用户多边形旋转-16度 计算新旋转用户的边界正方形/多边形 将多边形
这是一个复杂的问题。我可以概括一下让您实现这一目标的主要步骤: 解决方案大纲
- 谷歌地图Api投影:
- Google Maps API点平面文档:
- 多边形变换算法:
- 画一个多边形
- 单击绘制的多边形以旋转它
- 以下示例演示如何旋转多边形()
说明:
函数initMap(){
var map=new google.maps.map(document.getElementById('map'){
缩放:13,
中心:{lat:33.678,lng:-116.243},
mapTypeId:google.maps.mapTypeId.TERRAIN
});
var drawingManager=new google.maps.drawing.drawingManager({
drawingMode:google.maps.drawing.OverlyType.POLYGON,
drawingControl:对,
drawingControlOptions:{
位置:google.maps.ControlPosition.TOP_CENTER,
绘图模式:[
google.maps.drawing.overlytype.POLYGON
]
}
});
drawingManager.setMap(map);
google.maps.event.addListener(drawingManager,“OverlyComplete”,函数(事件){
var polygon=event.overlay;
google.maps.event.addListener(多边形,'click',函数(e){
自转多边形(多边形,5);
});
});
}
函数自动旋转多边形(多边形、角度){
window.setInterval(函数(){
旋转多边形(多边形,5);
}, 250);
}
函数旋转多边形(多边形、角度){
var map=polygon.getMap();
var prj=map.getProjection();
var origin=prj.fromLatLngToPoint(polygon.getPath().getAt(0));//围绕第一个点旋转
var coords=polygon.getPath().getArray().map(函数(latLng){
var点=从LATLNGTOPOINT(latLng)的prj;
var rotatedLatLng=prj.从点到点(旋转点(点、原点、角度));
返回{lat:rotatedLatLng.lat(),lng:rotatedLatLng.lng()};
});
多边形集合路径(coords);
}
函数旋转点(点、原点、角度){
var angleRad=角度*Math.PI/180.0;
返回{
x:Math.cos(angelrad)*(point.x-origin.x)-Math.sin(angelrad)*(point.y-origin.y)+origin.x,
y:Math.sin(angelrad)*(point.x-origin.x)+Math.cos(angelrad)*(point.y-origin.y)+origin.y
};
}
html,正文{
身高:100%;
保证金:0;
填充:0;
}
#地图{
身高:100%;
}
是否有任何内置算法允许我旋转用户polygonNo-旋转不是API的一部分。另请参阅: