Подтвердить что ты не робот

Карты Гугл; добавить карту места в маркер

Как вы можете видеть на следующем изображении, div (вверху слева) показывает текущий адрес маркера/направления/сохранение.

enter image description here

Это было сделано с использованием встроенного кода iframe на картах google. Но как вы можете сделать то же самое с пользовательской "закодированной" картой?

geocoder = new google.maps.Geocoder();

geocoder.geocode({
    "address": nw.google_pointer
}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {

        var myOptions = {
            zoom: parseInt(nw.google_zoom),
            center: results[0].geometry.location,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

        var marker = new google.maps.Marker({
            map: map,
            position: results[0].geometry.location,
            title: nw.google_pointer
        });
    } else {
        console.log('Geocode was not successful for the following reason: ' + status);
    }
});
4b9b3361

Ответ 1

jsbin с моим решением

Фон:

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

Метод:

  • Скопированный код карты и связанный css из встроенной версии.
  • В javascript добавьте карту html на визуализированную карту, когда она готова.

Моя настройка:

  • Взял параметр "Сохранить", потому что он не работает.
  • Позиционированная карта в правом верхнем углу - посмотрите на html, который добавлен в javascript, он жестко закодирован с абсолютной позицией, вы можете изменить это или связать его с классом, если хотите.

Надеюсь, это сработает для вас!

Ответ 2

Я добавил вторую карту в ответ @jcsmesquita, но на двух картах есть одинаковые карты: http://jsbin.com/vixehodaka/edit?html,css,js,output

поэтому я немного изменил код javascript: jsbin.com/dezorezohe/edit?html,css,js,output