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错误，地图就不会显示。我将Google地图的路径更改为

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指定显式尺寸：

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

可能只是你的div得到0px高度/ 0px宽度，这就是它没有出现的原因。

谷歌地图没有显示

1 个答案: