javascript - 当我打开 infoWindow (UTF-8) 时，Google map 变得很奇怪

Question

我正在为一个新项目使用 Google map ，但当我打开 infoWindow 时，我的 map 变得很奇怪。

见下图:

有人知道这个问题吗？

这是我的 map 初始化代码:

$(document).ready(function(){   

    function initialize() {
        var myLatlng = new google.maps.LatLng(59.398554, 5.486206);
        var mapOptions = {
            draggable: true, 
            zoomControl: true, 
            mapTypeControlOptions: {
                mapTypeIds: [google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.HYBRID]
            }, // here´s the array of controls
            disableDefaultUI: true, // a way to quickly hide all controls
            scrollwheel: false,
            zoom: 13,
            center: myLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }

        var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

        var contentString = '<div id="content">'+
            '<div id="siteNotice">'+
            '</div>'+
            '<h2 id="firstHeading" class="firstHeading">FjørSilkeBris</h2>'+
            '<div id="bodyContent">'+
            '<p>Førland, 5570 Aksdal</p>'+
            '<p>481 49 246 (Mobil)</p>'+
            '<p>Facebook: <a href="https://www.facebook.com/FjorSilkeBris">FjørSilkeBris på facebook.</a></p>'+
            '</div>'+
            '</div>';

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

        var marker = new google.maps.Marker({
            position: myLatlng,
            map: map,
            title:"Fjørsilkebris"
        });

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

    window.onload = function () {
        initialize();
    }
});

Answer 1

我遇到了同样的问题。

问题是，您页面上的某些 CSS 很可能将 img 元素的 max-width 属性设置为 100%。这会破坏 map 上信息窗口的 css。

您可以做的是覆盖 map Canvas div 示例的 img 最大宽度:

#divMap img { max-width: none; }

这对我有用