自定义 Google Places Map API“图标”InfoWindows

Question

我在自定义 google 地方 API 中的“点击”信息窗口时遇到问题。我可以使用places api来查找位置并自定义搜索到的infoWindows（图1），但我似乎无法弄清楚如何自定义由places图标启动的infoWindows（图2）。

抱歉，我的部分问题是我不知道那些特定的 infoWindows 被称为什么，如果我知道，我也许可以搜索解决方案。似乎该站点上的大多数问题都与自定义搜索到的 infoWindow 内容有关，而我已经成功地做到了这一点。

Searched Customized InfoWindow (image 1)

The InfoWindow that I want to customize and is launched by icons on the map (image 2)

Answer 1

那些被称为clickableIcons。来自the documentation

可点击图标 |类型：布尔值
当为 false 时，地图图标不可点击。地图图标代表一个兴趣点，也称为 POI。默认情况下，地图图标是可点击的。

和：

getClickableIcons() |返回值：布尔值
返回地图图标的可点击性。地图图标代表一个兴趣点，也称为 POI。如果返回值为真，则地图上的图标是可点击的。

要控制信息窗口，请停止打开默认窗口，如IconMouseEvent 文档中所述：

google.maps.IconMouseEvent对象规范

当用户单击地图上的图标时，会在事件中发送此对象。该地点的地点 ID 存储在 placeId 成员中。 要防止显示默认信息窗口，请在此事件上调用 stop() 方法以防止其传播。在 Places API 开发人员指南中了解有关地点 ID 的更多信息。

proof of concept fiddle

代码 sn-p：

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var iw = new google.maps.InfoWindow();
  google.maps.event.addListener(map, 'click', function(evt) {
    evt.stop()
    if (evt.placeId) {
      console.log(evt.placeId);
      iw.setContent(evt.placeId);
      iw.setPosition(evt.latLng);
      iw.open(map);
    }
  });
}
google.maps.event.addDomListener(window, "load", initialize);

html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script>
<div id="map_canvas"></div>