谷歌地图缩放控件无法正确显示

我用API3创build了一个简单的地图。 但是,左上方的缩放控件看起来“压扁” – 它们没有正确显示。 地图的其余部分是好的。 奇怪的是,我已经使用了与以前的网站相同的方法,在那里工作很好。

这是一些代码:

var directionDisplay; var directionsService = new google.maps.DirectionsService(); var map; var marker; var markersArray=[]; var html; //to create urls var directionsVisible = new Boolean(); directionsVisible = false; function initialize() { directionsDisplay = new google.maps.DirectionsRenderer(); var orchards = new google.maps.LatLng(52.512805,-2.76007); var myOptions = { zoom:14, mapTypeId: google.maps.MapTypeId.ROADMAP, center: orchards, panControl: false } map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); addMarker(orchards); } 

请任何人都可以提出什么是错的?

这个问题应该是因为通用img { max-width: 100%; } img { max-width: 100%; }

试试这个到你的CSS

 .gmnoprint img { max-width: none; } 

最初我面临同样的问题,后来我意识到

google.maps.event.addDomListener(window,'load',initialize);

扮演非常重要的angular色。

我添加了它,对我来说,它的工作原理。

签出以下代码。

CSS代码

 <style> #divmap { height: 300px; width:100%; margin: 10px; padding: 10px; } .gm-style img { max-width: none; } .gm-style label { width: auto; display: inline; } </style> 

对于JS

 <script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false"></script> <script> function initialize() { var mapOptions = { zoom: 5, center: new google.maps.LatLng(21,78), panControl:true, zoomControl:true, mapTypeControl:true, scaleControl:true, streetViewControl:true, overviewMapControl:true, rotateControl:true } var map = new google.maps.Map(document.getElementById("divmap"), mapOptions); } google.maps.event.addDomListener(window, 'load', initialize); </script> 

和最终的HTML

 <div id="divmap"></div> 

如果您正在使用Dreamweaverstream体网格function,则默认设置应如下所示:

 img, object, embed, video { max-width: 100%; } /* IE 6 does not support max-width so default to width 100% */ .ie6 img { width:100%; } 

尝试这个:

 object, embed, video { max-width: 100%; } #map_canvas img { max-width: none; } /* IE 6 does not support max-width so default to width 100% */ .ie6 img { width:100%; } 

只需要将代码replace即可。