Question

我试图在点击标记时显示标记群集上的信息。但它不起作用。

var markers = locations.map(function(location, i) {

        var marker = new google.maps.Marker({
          position: location,
          label: labels[i % labels.length]
        });

        marker.addListener('click', function() {
            infowindow.open(map, marker);
        });

        return marker;
      });

任何人都可以帮助我吗？

Answer 1

你需要通过css提供地图高度和宽度，

这是完整的代码，

<强> HTML

<div id="map-view"></div>

<强> CSS

#map-view{
  height:500px;
  width:500px;
}

<强> JS

$(document).ready(function(){
    initialization() 
});

function initialization() {

      var map = new google.maps.Map(document.getElementById('map-view'), {
        zoom: 3,
        center: {lat: 19.317779, lng: -91.459656},
        mapTypeId: 'roadmap',
      });
      map.setTilt(45);


      var labels = 'KLMNOPQRS';

      var contentString = '<div id="content">'+
          '<div id="siteNotice">'+
          '</div>'+
          '<h2 id="firstHeading" class="firstHeading">BMW 7 Series</h2>'+
          '<div id="bodyContent">'+
          '<p>Details goes here</p>' +
          '</div>';

      var infowindow = new google.maps.InfoWindow({
        content: contentString
      });


      var markers = locations.map(function(location, i) {

        var marker = new google.maps.Marker({
          position: location,
          label: labels[i % labels.length]
        });

        marker.addListener('click', function() {
            infowindow.open(map, marker);
        });

        return marker;
      });


      var markerCluster = new MarkerClusterer(map, markers,
          {imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'});
    }

var locations = [
{lat: 12.7781453358752, lng: -82.3715011598119},
{lat: 44.0026085052726, lng: -81.4873632217882},
{lat: 74.0086085052726, lng: -81.6873632217882}
];

Infowindow未显示在标记群集上

1 个答案: