Google maps 谷歌地图旋转多边形

在地图上绘制多边形形状后。我想通过围绕多边形的一个点旋转来更改刷新贴图时多边形指向的方向。例如，将多边形指向围绕第一个多边形点旋转90度的方向（代码如下所示）。有人能提供这方面的代码示例吗？ 我见过一些类似的帖子，但给出的例子似乎过于复杂

poly = new google.maps.Polygon({
  strokeWeight: 3,
  fillColor: '#5555FF'
});
poly.setMap(map);
poly.setPaths(new google.maps.MVCArray([path]));

  var triangleCoords = [
  new google.maps.LatLng(51.5087, -0.1277),
  new google.maps.LatLng(51.5387, -0.1077),
  new google.maps.LatLng(51.5387, -0.1477),
  new google.maps.LatLng(51.5087, -0.1277)
];

// Construct the polygon
triangle = new google.maps.Polygon({
  paths: triangleCoords,
  strokeColor: "#FF0000",
  strokeOpacity: 0.8,
  strokeWeight: 2,
  fillColor: "#FF0000",
  fillOpacity: 0.8
});
triangle.setMap(map);

google.maps.event.addListener(map, 'click', triangle);

}

---

你可能想看看迈克·威廉姆斯的作品。它最初是为GoogleMapsAPIv2编写的，但这演示了我移植到GoogleMapsAPIv3的版本

代码片段

var-map=null；
变量三角形、角度、点；
函数initMap（）{
point=新的google.maps.LatLng（44，-80）；
变量myOptions={
缩放：8，
中心:点,，
mapTypeControl:true，
mapTypeControlOptions：{
样式：google.maps.MapTypeControlStyle.DROPDOWN_菜单
},
导航控制：对，
mapTypeId:google.maps.mapTypeId.ROADMAP
}
map=new google.maps.map（document.getElementById（“map”），
肌肽）；
角度=0；
//==三角形===
三角形=google.maps.Polyline.RegularPoly（点，30000，3，角度，“#ff0000”，8，1）；
三角形.setMap（map）；
google.maps.event.addListener（三角形，“点击”，旋转角度）；
}
google.maps.event.addDomListener（窗口'load'，initMap）；
函数rotateTriangle（）{
triangle.setMap（null）；
角度+=90；
如果（角度>=360）角度-=360；
三角形=google.maps.Polyline.RegularPoly（点，30000，3，角度，“#ff0000”，8，1）；
三角形.setMap（map）；
google.maps.event.addListener（三角形，“点击”，旋转角度）；
}
//此Javascript基于
//社区教会Javascript团队
// http://www.bisphamchurch.org.uk/   
// http://econym.org.uk/gmap/
//从v3_eshapes.js：
//EShapes.js
//
//基于“thetoy”的一个想法和几行代码
//
//此Javascript由Mike Williams提供
//社区教会Javascript团队
//   http://www.bisphamchurch.org.uk/   
//   http://econym.org.uk/gmap/
//
//本作品根据知识共享许可证获得许可
//   http://creativecommons.org/licenses/by/2.0/uk/
//
//版本0.0 04/Apr/2008尚未完成
//版本1.0 2008年4月10日首次发布
//Lawrence Ross于2011年10月12日将版本3.0移植到v3
google.maps.Polyline.RegularPoly=函数（点、半径、顶点计数、旋转、颜色、权重、不透明度、选项）{
旋转=旋转| | 0；
变量倾斜=！（顶点计数和1）；
返回google.maps.Polyline.Shape（点、半径、半径、半径、旋转、顶点计数、颜色、权重、不透明度、选项、倾斜）
}
google.maps.Polyline.Shape=函数（点、r1、r2、r3、r4、旋转、顶点计数、颜色、权重、不透明度、选项、倾斜）{
如果（！颜色）{
color=“#0000FF”；
}
如果（！重量）{
重量=4；
}
如果（！不透明度）{
不透明度=0.45；
}
var rot=-rotation*Math.PI/180；
var点=[]；
var latConv=google.maps.geometry.sphereal.ComputedIstanceBeween（point，新的google.maps.LatLng（point.lat（）+0.1，point.lng（））*10；
var lngConv=google.maps.geometry.sphereal.ComputedDistanceBeween（point，new google.maps.LatLng（point.lat（），point.lng（）+0.1））*10；
var阶跃=（360/顶点计数）| 10；
var-flop=-1；
如果（倾斜）{
var I1=180/垂直计数；
}否则{
var I1=0；
}
对于（var i=I1；i，您可以使用新的Google Maps符号对象轻松地完成它

警告：当你有很多标记的时候，这在IE9中非常糟糕

祝你好运！
我也遇到了同样的问题，我想旋转一个符号或多边形。旋转属性定义了对象的旋转，仅此而已。
试试看

路径定义多边形的形状，并使用SVG符号，如（x，y）坐标

 function init_nuevo_mapa(){
        var mapOptions = {
        zoom: 13
        center: new google.maps.LatLng(-33.5351136,-70.5876618)
        };

        var new_map = new google.maps.Map(document.getElementById('new-map'), mapOptions);
        var myLatLng = new google.maps.LatLng(-33.5351136,-70.5876618)
        var image = {
                         path: 'M 0,0 -10,-30 10,-30 z',
                         rotation: 10, //10º clockwise
                         fillColor: "red",
                         fillOpacity: 0.5,
                         scale: 1,
                         strokeColor: "red",
                         strokeWeight: 4
                     };
        var marker = new google.maps.Marker({
                         position: myLatLng,
                         map: map,
                         icon: image,
                         zIndex: zIndex,
                         title: location[2]
                     });

下面的示例演示如何旋转多边形

注意：旋转是围绕第一个点执行的


函数initMap（）{
var map=new google.maps.map（document.getElementById（'map'）{
缩放：5，
中心：{lat:24.886，lng:-70.268}，
mapTypeId:google.maps.mapTypeId.TERRAIN
});
//定义多边形路径的板条坐标。
var triangleCoords=[
{lat:25.774，lng:-80.190}，
{lat:18.466，lng:-66.118}，
{lat:32.321，lng:-64.757}，
{lat:25.774，lng:-80.190}
];
//构造多边形。
var bermudaTriangle=新建google.maps.Polygon({
路径：三角形门，
strokeColor:“#FF0000”，
笔划不透明度：0.8，
冲程重量：2，
填充颜色：'#FF0000'，
不透明度：0.35
});
百慕大陆角。设定图（map）；
//旋转多边形
document.getElementById（'btnRotate'）。onclick=function（）{
旋转多边形（狗牙根角，90）；
};
}
函数旋转多边形（多边形、角度）{
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%；
}
#浮动面板{
位置：绝对位置；
顶部：10px；
左：25%；
z指数：5；
背景色：#fff；
填充物：5px；
边框：1px实心#999；
文本对齐：居中；