更改谷歌地图图标下拉菜单

Question

所以我有一个谷歌地图提供了许多不同的标记图标，用户通过下拉菜单选择：

<div class="btn-group white"> 
    <a id="location-type-menu-button" class="btn btn-primary dropdown-toggle" data- toggle="dropdown" href="#" >Select a Country <span class="caret"></span></a> 
     <ul id="location-type-menu" class="dropdown-menu"> 
       <li><a value="ItemI" href="#">Item I</a></li> 
       <li><a value="ItemII" href="#">Item II</a></li> 
       <li><a value="ItemIII" href="#">Item III</a></li>    </ul> 
</div> 

眼下，当下降向下选择菜单，它通过该位的jQuery改变了按钮的文本：

$(window).load(function() { 
      $("#location-type-menu li a").click(function() { 
       $("#location-type-menu-button:first-child").text($(this).text()); 
       $("#location-type-menu-button:first-child").val($(this).text()); 
      }); 

     }); 

，但我也希望它立即改变谷歌地图上的图标。谷歌地图标记由创建，最初设置为问号图标。

var customIcons = { 
      ItemI: { 
       icon: 'http://...' 
      }, 
      ItemII: { 
       icon: 'http://...' 
      }, 
      ItemIII: { 
       icon: 'https:...' 
      }, 
      question: { 
       icon: 'https:...' 
      } 
}; 
var icon = customIcons['question'] || {}; 
var marker = new google.maps.Marker({ 
       position: location, 
       icon: icon.icon, 
       map: map, 
       draggable: true 
      }); 

由于图标变量只调用创建一个新的标志时，我怀疑改变图标的​​变量不是这样做的方式。

我已经尝试了几个不同的东西，但选择不在这里包含它们，因为我不认为它们沿着正确的解决方案路径。我衷心感谢您的帮助。非常感谢！

Answer 1

确保您的标记是“click”事件定义，那么你可以简单地更新图标，

如：

marker.setIcon(customIcons['ItemI'].icon);