Совместное изображение в центр Div Google-Map Div ⇐ CSS

[Anonymous]

Я пытаюсь выравнивать изображение в центр карты Google Div. < /p>

В основном это изображение предназначено для применения той же функциональности, что и Uber. Как и в наличии плавающего маркера, который всегда выровнен с центром карты.
Проблема в том, что я могу исправить его для работы на одну карту. но если размер карты div изменяется, то изображение больше не указывает на центр карты. < /p>

Вот как это работает в Uber.


Вот мой пример кода тела

Код: Выделить всё

[img]http://mt.googleapis.com/vt/icon/name=icons/spotlight/spotlight-poi.png[/img]


var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 28.625789, lng: 77.0547899},
zoom: 8
});

var marker = new google.maps.Marker({
position: map.getCenter(),
map: map,
title: 'Hello World!'
});
}


< /code>

< /p>

Это css < /p>

   html, body {
height: 100%;
margin: 0;
padding: 0;
}
#map {
height: 100%;
}

#static-img{
position:absolute;
top:44%;
width:100%;
text-align:center;
}

Вот тест jsfiddle
https://jsfiddle.net/pyuu8rqso/1/

Как мне исправить это?


Подробнее здесь: https://stackoverflow.com/questions/363 ... le-map-div