谷歌地图不显示

Question

我一直在谷歌地图API v.3的问题。

我有我的画布声明如下

<div id="map_canvas" style="width: 
50%; height: 50%; margin-left: auto; 
margin-right: auto"> 

，并在我的JavaScript函数

var myOptions = { 
    zoom: 8, 
    center: myLatlng, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
} 

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

一切工作正常。

然而，当我把地图中的表单内像

<form id="_frm" runat="server"> 
    <table> 
     . 
     . 
     . 
    </table> 
    <div id="map_canvas" style="width: 50%; height: 50%; margin-left: auto; margin-right: auto"> 
    </div> 
    <table> 
     . 
     . 
     .   
    </table> 
    </form> 

地图上没有显示，而不会产生JS错误。 我改变了我的谷歌地图的路径

var mydiv=document.forms[0].getElementsByTagName("div")[2]; 

，并增加了警示语句来查看ID。所以现在我有

var myOptions = { 
    zoom: 8, 
    center: myLatlng, 
    mapTypeId: google.maps.MapTypeId.ROAD  
} 

var mydiv=document.forms[0].getElementsByTagName("div")[2]; 
alert(mydiv.id); 
var map = new google.maps.Map(mydiv , myOptions); 

同时警告语句显示map_canvas地图上仍然不会显示。

任何帮助吗？

Answer 1

尝试指定明确的尺寸为您的地图格：

<div id="map_canvas" style="width:200px; height: 200px; margin-left: auto; 
    margin-right: auto"> 

这可能只是你的div得0像素高度/ 0像素宽，这就是为什么它没有显示出来。