在 Google 个地图标记对象上添加 infoWindows

Question

我想在 windows 多个标记上添加信息，这些标记成簇地放置在 google 地图上。下面是我的代码。当我点击标记时，什么也看不到。请看一下。

function initMap() {
  var map = new google.maps.Map(document.getElementById("map"), {
    zoom: 10,
    center: { lat: 62.601, lng: 29.7636 },
  });
  var infowindow = new google.maps.InfoWindow();
  var markers = locations.map(function (location, i) {
    return new google.maps.Marker({
      position: location,
      title: "test",
    });
    google.maps.event.addListener(markers, "click", function () {
      infowindow.setContent("<h3>" + "testing" + "</h3>");
      infowindow.open(map, this);
    });
  });
  // Add a marker clusterer to manage the markers.
  var markerCluster = new MarkerClusterer(map, markers, {
    imagePath:
      "https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m",
  });
}

Answer 1

在您的 .map() 中，您在添加 EventListener 之前 return 标记您的标记，因此它永远不会被添加。

假设这是向标记添加 EventListener 的正确方法，请执行以下操作 - 临时保存它，并在添加 EventListener 之后 return 像此代码段中那样:

function initMap() {
  var map = new google.maps.Map(document.getElementById("map"), {
    zoom: 10,
    center: { lat: 62.601, lng: 29.7636 },
  });
  var markers = locations.map(function (location, i) {
    const marker = new google.maps.Marker({ // temp save
      position: location,
      title: "test",
    });

    google.maps.event.addListener(marker, "click", function () { // add eventlistener to marker
      var infowindow = new google.maps.InfoWindow(); // probably also move infoWindow initialization in here
      infowindow.setContent("<h3>" + "testing" + "</h3>");
      infowindow.open(map, this);
    });

    return marker; // return after
  });
  // Add a marker clusterer to manage the markers.
  var markerCluster = new MarkerClusterer(map, markers, {
    imagePath:
      "https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m",
  });
}

在 Google 个地图标记对象上添加 infoWindows

Adding infoWindows on Google Maps marker objects

javascript

google-maps

maps

cluster-computing

infowindow