javascriptmapquest

Capturing latitude and longitude on marker drag in MapQuest


I can't seem to find a way to get the latitude and longitude from existing markers in MapQuest.

I currently set my directions map using:

var map = L.mapquest.map('map', {
    center: [selfLatitude, selfLongitude],
    layers: L.mapquest.tileLayer('map'),
    zoom: 13
});

L.mapquest.directions().route({
    start: [selfLatitude, selfLongitude],
    end: [otherLatitude, otherLongitude]
});

This produces a Map with the two points and the direction between them.

I am able to move the end point on the map but want to capture the modified latitude and longitude.

What is the proper way to target and get the coordinates from individual markers in a MapQuest Map using the mapquest.js javascript library?


Solution

  • I thought this would be an easy solution, but I could not find anything easily in their documentation. I tried picking apart their examples and looking everywhere for bit of information. After assuming this would work, but didn't because getLatLng() is not a function:

      popup.on('dragend', function(event) {
        var marker = event.target;
        var position = marker.getLatLng().wrap();
        showLL(position, 'USER_DEFINED');
      });
    

    At some point I decided to stop looking at the doc's they provided and tried to look at their Lat/Long finder example and look further into the event.target object that was returned and tried to find anything related to the lat and long.

    I know you asked for a "proper" way, but I honestly couldn't find one and thought I should share anyways.

    The below is def not an official way to do this, but I believe it works. For some reason the moveend event is fired whether the start or end is moved, but I only log the end lat/long anyways.

    I noticed that marker._layers[prop].locationIndex was mixed in the layers obj and 0 seems to correlate to the start marker and 1 seemed to point to the end marker.

    Here's what I came up with:

    let latLng1 = new L.LatLng(35.6009, -82.554);
    let latLng2 = new L.LatLng(35.7796, -78.6382);
    
    let map = L.mapquest.map('map', {
      center: latLng1,
      layers: L.mapquest.tileLayer('map'),
      zoom: 13
    });
    
    let directions = L.mapquest.directions();
    
    directions.route({
      start: latLng1,
      end: latLng2
    });
    
    map.on('moveend', function(event) {
      let marker = event.target;
      for (let prop in marker._layers) {
        if (!marker._layers.hasOwnProperty(prop)) continue;
    
        // locationIndex- I am assuming 0 for start marker and 1 for end marker.
        if (marker._layers[prop].locationIndex === 1) {
          let latLong = marker._layers[prop]._latlng;
          console.log(latLong)
        }
      }
    });
    }