JS и Google Map - Центрирование карты по маркеру

У меня возникли проблемы с центрированием карты по маркеру, вот b*:

           <iframe
          width="555"
          height="450"
          frameborder="0" style="border:0"
          src="https://www.google.com/maps/embed/v1/place?key=***&q=<? echo urlencode($address); ?>&zoom=14">
        </iframe>

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

Кто-нибудь знает, как центрировать карту с положением маркера?

Извините за повторный вопрос, но ответы, которые я видел до сих пор, не работали в моем случае.


google-maps javascript google-maps-embed
person Moisés    schedule 16.05.2014    source источник
comment
Вы можете указать атрибут URL center, если у вас есть широта и долгота. См. developers.google.com/maps/documentation/embed/. Однако Я ожидал, что режим place автоматически отцентрирует карту на вашем адресе.   -  person duncan    schedule 19.05.2014
comment
к сожалению, я не использую динамическую страницу, и местоположение будет меняться в зависимости от адреса, указанного администратором страницы.   -  person Moisés    schedule 19.05.2014

Ответы (1)


arrow_upward
0
arrow_downward

К сожалению, я не смог заставить его работать с iframe, вместо этого я использовал способ JS...

JS:

geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(40.730885,-73.997383);
var mapOptions = {
    scrollwheel: true,
    zoom: 15,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map"), mapOptions );

var address = 'address string';
geocoder.geocode(
{ 'address': address},
function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);

        var latitude = results[0].geometry.location.lat();
        var longitude = results[0].geometry.location.lng();

        marker = new google.maps.Marker({
            draggable: true,
            map: map,
            position: results[0].geometry.location
        });
    } else {
        //alert('Location not found.');
    }
}
);

HTML:

        <div id="map-canvas">
            <div id="map" style="width:555px;height:450px;"></div>
    </div>
    <script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=true"></script>

который я избегал использовать, причина привела к другой проблеме с отображением CSS как нулевого при загрузке страницы... но это было решено (нет причин объяснять, как причина не участвовала в вопросе ^^").

В любом случае, если кто-нибудь найдет решение для примера iframe, все равно будет интересно... но это все, ребята, o/

person Moisés    schedule 19.05.2014