Вопрос по javascript, google-maps-api-3 – Как установить карту для div внутри другого div?

5

Я новичок в javascript, и мне нужна ваша помощь в настройке карты Google для элемента div, который находится внутри другого элемента div. Вот код, который работает, если элементы div не вложены:

function initialize() {

var myOptions = {
    center: new google.maps.LatLng(-34.397, 150.644),
    zoom: 8,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};

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

Однако, если у меня есть вложенные div, это не сработает:

<body onload="initialize()">
<div id="main">
    <div id="map_canvas" style="width:100%; height:100%"></div>
</div>
</body>

Как мне решить эту проблему?

Ваш Ответ

2   ответа
5

что вам нужно установить высотуid="main" Div также

style="width:100%; height:100%"

Поскольку это контейнер для карты, и без определенной высоты ничего не появится. Это похоже на закатывание занавеса, карта сама по себе не опустит его.

Я предполагаю, что у вас уже есть что-то похожее, поскольку карта работает без вложенности, но я упомяну это еще раз:

<style type="text/css">
  html, body {height:100%}
</style>
Добро пожаловать!
Благодарю. Работал отлично. Я искал проблему в совершенно неправильном месте. reederz
1

использовать% для высоты и ширины, если родительский div не имеет статического размера. Также на карте Google есть ошибка, которую она не может загрузить в скрытом div. (если нужно, у вас должен быть какой-то трюк)

Похожие вопросы