CODEWITHSUNDEEP
javascripthtmlleaflet
CaptStone Information Technolo
CaptStone Information Technolo

Reputation: 83

How to transfer Leaflet Markers Lat/Long in textbox

My code below will add a marker in a map and display its lat/lng in alert.

var note = document.getElementById('note');
var datepick = document.getElementById('demo1');
var timepick = document.getElementById('timepick');
layerpoly.on('click', function(e){
    var markerA = new L.Marker(e.latlng,{icon: Icon1});
    markerA.bindPopup("</a><br><strong>FIRE</strong></br><strong>Date:</strong>"+datepick.value+"</br><strong>Time:</strong>"+timepick.value+"</br><strong>Address:</strong>"+note.value+"<strong><br><strong>Suspect Sketch</strong><br><a href=legends/suspect.jpg rel=lightbox><img src = legends/suspect.jpg height=100 width = 100/>").addTo(map);
    closure1 (markerA)
    alert(markerA.getLatLng());

How can i transfer the lat/lng in two separate textbox during click event?

<input id="userLat" type="text" name="val-lat" value="User Latitude" />
<input id="userLng" type="text" name="val-lng" value="User Longitude" />

Upvotes: 0

Views: 2912

Answers (1)

Jarek Pi&#243;rkowski
Jarek Pi&#243;rkowski

Reputation: 648

markerA.getLatLng() returns a Leaflet LatLng object. To get the numbers individually, do something like:

var ll = markerA.getLatLng();
alert("latitude: " + ll.lat);
alert("longitude: " + ll.lng);

Then assign it to the input boxes as you would with any other Javascript task:

var ll = markerA.getLatLng();
document.querySelector('#userLat').value = ll.lat;
document.querySelector('#userLng').value = ll.lng;

Upvotes: 1

Related Questions