1

I'm wondering how can I get lat and lon out of the function in a variable with global scale in Leaflet. The code to get the coordinates per click in the map works fine but then I can't write my lat and lon in global variables. My code which doesn't work look like this:

var lat;
var lon;

function clickEvent(e) {

        if (typeof(newMarker)==='undefined'){
            newMarker = new L.marker(e.latlng, { draggable: true });
            newMarker.addTo(satMap);}
        else { newMarker.setLatLng(e.latlng);}


        lat = e.latlng.lat;
        lon = e.latlng.lng;
}

satMap.on('click', clickEvent);
document.write(lat);
  • 1
    If code in your app is as in example above it behaves correctly. When statement document.write(lat); is executed variable lat is undefined since map has not been clicked yet. Whatever you want to do with lat and lon variables has to be trigerred from inside clickEvent or has to happen after the event. – TomazicM Feb 22 '18 at 18:50
0

TomazicM was right, to demo this, your Global is populated but you show undefined because it runs before your click is finished. I modified your code to show you. By putting a function call after Lat, lon is defined by your function you can see it's values are really changed.

var lat;
var lon;

function clickEvent(e) {

        if (typeof(newMarker)==='undefined'){
            newMarker = new L.marker(e.latlng, { draggable: true });
            newMarker.addTo(satMap);}
        else { newMarker.setLatLng(e.latlng);}


        lat = e.latlng.lat;
        lon = e.latlng.lng;
        console.log(lat + " Inside");
        now();
}

satMap.on('click', clickEvent);
console.log(lat + " Global");

function now(){
    console.log(lat + " Global after click");
}
  • Ah, got it. I have to call the variables in a function afterwards. Thank you so much for your hints. You saved my Master Thesis :-) – user114969 Feb 25 '18 at 16:38
2

I think you need to attach your function to a click event with .on('click').

For example:

var lat;
var lng;

map.on('click', function(e) {
    console.log(e.latlng);  //So you can see if it's working
    lat = e.latlng.lat;
    lng = e.latlng.lng;
});

There are different ways you can implement the function to include other things (like placing markers), but the main point in your case is the layer.on('click') part, otherwise it's not listening for a click. There are some good examples in this tutorial.

  • Unfortunately, if I test it by the document.write (lat); statement out of the function, the variable lat is still undefined. – user114969 Feb 22 '18 at 0:11
  • If you edit your question to include that part of the script someone might be able to help with that part. – Bird Feb 22 '18 at 0:23
  • @user114969 it is undefined after you click on the map ? – Shiko Feb 22 '18 at 1:40
  • unfortunately yes – user114969 Feb 22 '18 at 9:21

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.