Google maps 谷歌地图信息窗口未正确显示

单击标记时，信息窗口在我的地图上未正确显示。网站在这里

您还会注意到地图控件也没有正确显示

    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());
    }

var映射；
var位置=；
变量标记=[]
jQuery（函数（$）{
变量选项={
中心：新google.maps.LatLng（51.840639771473,5.8587418730469），
缩放：8，
mapTypeId:google.maps.mapTypeId.ROADMAP
};
map=new google.maps.map（document.getElementById（“map_canvas”），选项）；
对于（变量i=0；i

---

注意：我使用的是Google Maps JS V3。

这个问题是由style.css中的这种格式造成的：

img {
    height: auto;
    max-width: 100%;/* <--the problem occurs here*/
}

---

问题可能是您正在使用

img{max width:100%；}

作为通用

在你的css中试试这个

.gmnoprint img {
    max-width: none; 
}

---

在Magento案例中，由于与原型库冲突，google地图缩放控件未显示。

我解决了以下问题：

.gmnoprint img {
    max-height: none;  
}

而不是

最大宽度

---

谢谢

我尝试了大多数internet答案，但都没有用（不起作用），我添加了自定义css和地图缩放控件，它们也可以显示并启用标记单击

.gmnoprint{ 显示：阻止！重要 } .gmnoprint.gm-bundled-control.gm-bundled-control-on-bottom{ 显示：块！重要； } .gm tilt{ 显示：无； } .gm iv地址{ 高度：56px； }

---

我也追踪到了CSS问题。在我的例子中，我们有一个库将所有div设置为position:relative。回到初始状态后，我们的控制又回到了原位

.gm-style div {
    position:initial;
}

---

这也为我解决了问题。如果有人想知道它是什么样子的，看，这很明显，但它节省了我很多时间。谢谢你，老兄，谢谢！在我的例子中，缩放控制受到在引导模式窗口中显示mao的影响…谢谢，也为我修复了它。工作起来很有魅力！（+1）不再有指向您网站的链接，因此不清楚您遇到了什么问题。你现在的问题不太可能在将来帮助任何用户。它也可能是一个与这里描述的问题类似的问题：为什么在一年多后发布与已接受答案相同的内容？@0x1gene

img{max width:100%}

的原因将影响项目的其他css属性。同时，

.gmnoprint img:{max width:none；}

不会影响任何属性。 .gmnoprint{ display: block !important } .gmnoprint.gm-bundled-control.gm-bundled-control-on-bottom { display: block !important; } .gm-tilt { display: none; } .gm-iv-address{ height: 56px; }

.gm-style div {
    position:initial;
}