Карты Google не отображаются - PullRequest
3 голосов
/ 11 сентября 2010

У меня возникла проблема с 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];

и добавил предупреждение, чтобы увидеть идентификатор.Так что теперь у меня есть

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 карта все равно не будет отображаться.

Любая помощь с этим?

1 Ответ

4 голосов
/ 11 сентября 2010

Попробуйте указать явные размеры для вашей карты div:

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

Возможно, ваш div получает 0px height / 0px width, и поэтому он не отображается.

...