Google Map Infowindow无法正常显示

Jen*_*nny 28 google-maps infowindow google-maps-api-3

单击标记时,infowindow在我的地图上显示不正确.该网站在这里.

您还会注意到地图控件也未正确显示.

    var map;
    var locations = <?php print json_encode(di_get_locations()); ?>;
    var markers = []
    jQuery(function($){
        var options = {
            center: new google.maps.LatLng(51.840639771473, 5.8587418730469),
            zoom: 8,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById("map_canvas"), options);

        for (var i=0; i < locations.length;i++) {
            makeMarker(locations[i]);
        }
        centerMap();

    });
    function makeMarker(location) {
        var markerOptions = {map: map, position: new google.maps.LatLng(location.lat, location.lng)};
        var marker = new google.maps.Marker(markerOptions);
        markers.push(marker);
        var content = '';

        var infowindow = new google.maps.InfoWindow(
          { content: "test",
            size: new google.maps.Size(50,50),
            disableAutoPan : true
          });


        google.maps.event.addListener(marker, 'click', function(e) {
            infowindow.open(map,marker);
        });
    }
    function centerMap() {
      map.setCenter(markers[markers.length-1].getPosition());
    }
Run Code Online (Sandbox Code Playgroud)

注意:我正在使用Google Maps JS V3.

Dr.*_*lle 96

style.css中的这种格式强制要解决这个问题:

img {
    height: auto;
    max-width: 100%;/* <--the problem occurs here*/
}
Run Code Online (Sandbox Code Playgroud)

将其添加到style.css的末尾,以在地图内应用图像的默认值:

#map_canvas img{max-width:none}
Run Code Online (Sandbox Code Playgroud)

  • 天哪,谢谢!在我的情况下,变焦控制受到在Bootstrap模态窗口中显示毛的影响.... (5认同)