谷歌地图无法显示

Question

我是一位有帮助的助手，可以为您翻译文本。

我一直遇到Google Maps 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，但地图仍然不会显示。

有任何帮助吗？

- The Underdog

Answer 1

尝试为您的地图

指定明确的尺寸：

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

可能是因为您的

标签高度或宽度为0像素，所以无法显示出来。

- Dan Dumitru