Javascript 谷歌地图标记图标（符号）不旋转

我昨天发布了一个问题，通过排版更正得到了解决，但现在我遇到了一个困扰我的问题

我在地图上有一个自定义标记，使用一个符号作为图标，这样我可以旋转它。当我初始化它时，我将旋转设置为0，并在某个点调用

updateMap（）

函数，该函数应该给标记一个新的旋转值。确实如此，我可以通过在控制台中打印标记和它的图标看到旋转已经改变，但是标记仍然坚定地指向北方

以下是我初始化和旋转标记的代码：

var map;
var marker;

function initMap(position) {
    var map_div = document.getElementById("map");
    map = new google.maps.Map(map_div, {
        zoom: 14,
        center: { lat: position.Latitude, lng: position.Longitude },
        mapTypeId: 'terrain'
    });
    marker = new google.maps.Marker({
        position: map.getCenter(),
        map: map,
        title: "MY MARKER",
        icon: {
            path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
            scale: 4,
            strokeColor: '#00F',
            rotation: 0,
        }
    });
}

function updateMap() {
    var bearing = 135;
    console.log(bearing);
    marker.icon.rotation = bearing;
    console.log(marker);
}

控制台告诉我标记的旋转已经改变，但是标记本身没有改变方向

我尝试过的事情：

• 在更新地图功能结束时触发调整大小事件

• 未指定图标的原始旋转

• 切换旋转，从135开始并尝试更改为0（调用

  updateMap（）

  后，标记在

  marker.icon.rotation

  处的旋转值变为0，但实际标记始终指向135）

• 更改

  initMap（）

  函数末尾的右旋转-这确实有效，这让我相信

  updateMap（）

  函数有些地方不正确。我不知道是什么，它仍然执行这个函数。在全局范围内记录标记也会告诉我旋转已经改变

---

欢迎提出任何意见或建议。

您只需将

updateMap

功能更改为：

function updateMap() {
  var bearing = 135;
  console.log(marker.icon);
  marker.icon.rotation = bearing;
  marker.setMap(map);
  console.log(marker.icon);
}

marker.setMap（map）更新选项后重新添加到地图

JSFiddle：
您只需将
updateMap
函数更改为：

function updateMap() {
  var bearing = 135;
  console.log(marker.icon);
  marker.icon.rotation = bearing;
  marker.setMap(map);
  console.log(marker.icon);
}

marker.setMap（map）更新选项后重新添加到地图

JSFiddle：
对象没有文档化的
图标
属性（虽然它可能“工作”，但不建议使用未文档化的属性）。使用记录在案的setter和getter获取值，对其进行更改，然后再次设置：

function updateMap() {
    var bearing = 135;
    console.log(bearing);
    var icon = marker.getIcon();
    icon.rotation = bearing;
    marker.setIcon(icon);
    console.log(marker);
}


代码片段：


var映射；
var标记；
函数初始化映射（位置）{
var map_div=document.getElementById（“map”）；
map=新的google.maps.map（map\u div{
缩放：14，
中心：{
纬度：位置，纬度，
位置，经度
},
mapTypeId:'地形'
});
marker=新的google.maps.marker({
位置：map.getCenter（），
地图：地图，
标题：“我的记号笔”，
图标：{
路径：google.maps.SymbolPath.FORWARD\u CLOSED\u箭头，
比例：4，
strokeColor:“#00F”，
轮换：0，
}
});
}
函数更新映射（轴承）{
var icon=marker.getIcon（）；
icon.旋转=轴承；
marker.setIcon（图标）；
}
函数初始化（）{
初始映射({
纬度：37.4419，
经度：-122.1419
});
}
google.maps.event.addDomListener（窗口“加载”，初始化）
html，
身体
#地图{
身高：100%；
宽度：100%；
边际：0px；
填充：0px
}
对象没有文档化的
图标
属性（虽然它可能“工作”，但不建议使用未文档化的属性）。使用记录在案的setter和getter获取值，对其进行更改，然后再次设置：

function updateMap() {
    var bearing = 135;
    console.log(bearing);
    var icon = marker.getIcon();
    icon.rotation = bearing;
    marker.setIcon(icon);
    console.log(marker);
}


代码片段：


var映射；
var标记；
函数初始化映射（位置）{
var map_div=document.getElementById（“map”）；
map=新的google.maps.map（map\u div{
缩放：14，
中心：{
纬度：位置，纬度，
位置，经度
},
mapTypeId:'地形'
});
marker=新的google.maps.marker({
位置：map.getCenter（），
地图：地图，
标题：“我的记号笔”，
图标：{
路径：google.maps.SymbolPath.FORWARD\u CLOSED\u箭头，
比例：4，
strokeColor:“#00F”，
轮换：0，
}
});
}
函数更新映射（轴承）{
var icon=marker.getIcon（）；
icon.旋转=轴承；
marker.setIcon（图标）；
}
函数初始化（）{
初始映射({
纬度：37.4419，
经度：-122.1419
});
}
google.maps.event.addDomListener（窗口“加载”，初始化）
html，
身体
#地图{
身高：100%；
宽度：100%；
边际：0px；
填充：0px
}