谷歌地图导航按钮错误

时间:2014-03-25 13:41:06

标签: javascript google-maps google-maps-api-3

我正在尝试解决在我的网站中嵌入Google地图时我遇到的这个随机错误。一切都很好,除了导航按钮都不合适/破碎的部分。

下面是截图,解释我正在谈论的内容(以红色突出显示)

Bug

右边,它应该是这样的:

Proper

我不知道如何解决这个问题,如果有人之前遇到过同样的问题,我会很感激你的帮助。

以下是代码:

function initialize() {
                var latlng = new google.maps.LatLng(57.0442, 9.9116);
                var mapOptions = {
                    zoom: 15,
                    center: latlng,
                    mapTypeControl: true,
                    mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR},
                    navigationControl: true,
                    navigationControlOptions: {style: google.maps.NavigationControlStyle.LARGE},
                    mapTypeId: google.maps.MapTypeId.ROADMAP};
 
    var map = new google.maps.Map(document.getElementById("location-canvas"), mapOptions);

    var contentString = '<div id="content">'+
                    '<div id="siteNotice">'+
                    '</div>'+
                    '<h1 id="firstHeading" class="firstHeading">Høgenhaug</h1>'+
                    '<div id="bodyContent">'+
                    '<p id="maps">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>'+
                    '</div>'+
                    '</div>';

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


                var companyImage = new google.maps.MarkerImage('img/maps/logo.png',
                    new google.maps.Size(100,50),
                    new google.maps.Point(0,0),
                    new google.maps.Point(50,50)
                );

                var companyShadow = new google.maps.MarkerImage('img/maps/logo_shadow.png',
                    new google.maps.Size(130,50),
                    new google.maps.Point(0,0),
                    new google.maps.Point(65, 50));

                var companyPos = new google.maps.LatLng(57.0442, 9.9116);

                var companyMarker = new google.maps.Marker({
                    position: companyPos,
                    map: map,
                    icon: companyImage,
                    shadow: companyShadow,
                    title:"Høgenhaug",
                    zIndex: 3});

                        
google.maps.event.addDomListener(window, 'resize', initialize);
google.maps.event.addDomListener(window, 'load', initialize);
google.maps.event.addListener(companyMarker, 'click', function() {
                    infowindow.open(map,companyMarker);
                });

}

由于

1 个答案:

答案 0 :(得分:1)

我的地图曾经有过这个。尝试将此添加到您的CSS:

#location-canvas img {
  max-width: none;
}