Меняйте значение скрытого поля каждый раз, когда позиция маркера изменяется на карте - PullRequest
Новая
       4

Меняйте значение скрытого поля каждый раз, когда позиция маркера изменяется на карте

0 голосов
/ 26 апреля 2011

Я создаю приложение Google Maps, в котором я позволяю пользователю размещать только один маркер на карте, нажимая на карту. Каждый раз, когда пользователь снова нажимает на карту, старый маркер удаляется, и маркер помещается в новое место щелчка. У меня есть скрытое поле ввода, и я хочу, чтобы его значение менялось каждый раз, когда маркер меняет положение. Это значение должно быть координатами нового местоположения маркера. Код, который я написал для этого, выглядит следующим образом: 

var map;
var marker;
var coords;

function initialize() {
    var latlng = new google.maps.LatLng(19.074448,72.872314);
    var myOptions = {
    zoom: 12,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    google.maps.event.addListener(map, 'click', function(event) {
        placeMarker(event.latLng);
        });
};

function placeMarker(location) {
    if (marker) {
        marker.setMap(null);
        marker = null;
        placeMarker(location);
    }
    else {
        marker = new google.maps.Marker({
            position: location,
            map: map
            });
        document.getElementById("id_lat").value = marker.getPosition().toUrlValue()
    }
};

В частности, я использую эту строку для изменения значения, 

document.getElementById("id_lat").value = marker.getPosition().toUrlValue()

где id соответствующего скрытого поля - "id_lat" Это, кажется, не работает, хотя. Что я делаю не так и как мне это исправить? Я новичок в JavaScript.

1 Ответ

0 голосов
/ 26 апреля 2011

Я думаю, что вы забыли добавить свой маркер в функцию initialize (). Кроме этого ваш код, кажется, работает нормально. 

var map;
var marker;
var coords;

function initialize() {
    var latlng = new google.maps.LatLng(19.074448,72.872314);
    var myOptions = {
        zoom: 12,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    google.maps.event.addListener(map, 'click', function(event) {
        placeMarker(event.latLng);
    });
    // add a marker on map
    placeMarker(latlng);
};

function placeMarker(location) {
    if (marker) {
        marker.setMap(null);
        marker = null;
        placeMarker(location);
    } else {
        marker = new google.maps.Marker({
            position: location,
            map: map
        });
        document.getElementById("id_lat").value = marker.getPosition().toUrlValue();
            // worked for me for <input type="text" value="Submit" id="id_lat" style="display:none"/> element
        alert(document.getElementById("id_lat").value);
    }
};
...