Google Map API v3在IE9中无法加载

Question

我尽力研究了这个主题，但没有找到解决方案。

除Internet Explorer（8或9版本）外，下面的脚本将可在所有浏览器中加载Google地图。然而，在 IE8 和 IE9 中，Google地图API（v3）似乎无法加载。我查看控制台以找到特定错误，但没有发现任何问题。

Html

<style type="text/css">
    #map_canvas { 
        height: 292; 
        width:980 
    }

    .contactus-Captcha {
        clear:both;
    }
</style>

<div id="map_canvas"></div>

Javascript

function initialize() {
            var homeLatlng = new google.maps.LatLng(29.70280,-95.51731);

            var myOptions = {
                zoom: 15,
                center: homeLatlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };

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


                var contentString = '<div id="content">'+
                        '<div id="siteNotice">'+
                        '</div>'+
                        '<h3>ABC</h3>'+
                        '<div id="bodyContent">'+
                        '<div class="AddressWrap"><div style="width:100%; margin:1 auto; float:left;"><img src="<?php echo ROOTPATH; ?>images/location-icon.png" style="float:left; padding-right:5px;"> <h3 class="Marker"> xyz</h3></div><h3 class="Mobile"> <img src="<?php echo ROOTPATH; ?>images/mob-icon2.png" style="float:left; padding-right:12px; "> 123445</h3></div>'+
                        '</div>'+
                        '</div>';
                    var infowindow = new google.maps.InfoWindow({
                        content: contentString
                    });

            var image = new google.maps.MarkerImage(        
                '<?php echo ROOTPATH; ?>images/addres-icon.png',
                new google.maps.Size(32, 32),   // size
                new google.maps.Point(0,0), // origin
                new google.maps.Point(16, 32)   // anchor
            );

            var shadow = new google.maps.MarkerImage(
                'http://maps.google.com/mapfiles/ms/micons/msmarker.shadow.png',
                new google.maps.Size(59, 32),   // size
                new google.maps.Point(0,0), // origin
                new google.maps.Point(16, 32)   // anchor
            );

            var homeMarker = new google.maps.Marker({
                position: homeLatlng, 
                map: map,
                title: "xyz",
                icon: image,
                shadow: shadow
            });
            google.maps.event.addListener(homeMarker, 'click', function() {
                        infowindow.open(map,homeMarker);
                    });
        }    

  $(document).ready(function() {            
    initialize(); //Calling on load
  });

有人可以帮我吗？我会非常感激！

- Pank

---

你是通过http://还是https://进行加载的？ - Gary Klasen

我正在使用HTTP协议。 - Pank

感谢Brad进行了出色的编辑... - Pank

Answer 1

你的地图没有尺寸。请修改：

#map_canvas { height: 292; width:980 }

To:

#map_canvas { height: 292px; width:980px }

- geocodezip