1

I am trying to incorporate pgRouting layer from geoserver to my HTML GUI. For this I have been trying to make a function that will take coordinate values from a Leaflet marker and feed them into my specified parameters. The parameters will act as start and end points for the routing layer. I can't seem to get any lat/lon values to enter into my var viewparams. The code is as follows:

var params = {
    LAYERS: 'IST_Mosaic:pgRouting',
    FORMAT: 'image/png',
    SERVICE: 'WMS',
    request: 'GetMap'
}
var selectedPoint = null;

var sourceMarker = L.marker([33.5183, 73.1789], {
    draggable: true
})
.on("dragend", function(e) {
    selectedPoint = e.target.getLatLng(); console.log(selectedPoint)
    getRoute(); 
})
.addTo(map); 

// draggbale marker for destination point.Note the marker is initialized with an initial destination positon
var targetMarker = L.marker([33.5191, 73.1768], {
    draggable: true
})
.on("dragend", function(e) {
    selectedPoint = e.target.getLatLng(); console.log(selectedPoint)
    getRoute(); 
})
.addTo(map); 

function getRoute(){
    var start = sourceMarker.getLatLng();  
    var end = targetMarker.getLatLng();   
    var viewparams = [
        'x1:' + start[0], 'y1:' + start[1],
        'x2:' + end[0], 'y2:' + end[1]
      ];
      params.viewparams = viewparams.join(';'); console.log(viewparams)
      var routing = L.tileLayer.wms('http://localhost:8010/geoserver/wms' , {
        layers: 'IST_Mosaic:pgRouting',
        format: 'image/png',
        transparent: true
    });
}
getRoute();

Please can anyone suggest a solution to this and point out what I am doing wrong. A screenshot for the results: The values for x1, y1, x2 and y2 remain undefined

4
  • 1
    .getLatLng() method returns L.LatLng object, which has coordinates in properties .lat and .lng, so correct reference would be start.lng and start.lat.
    – TomazicM
    Jul 17 '20 at 9:02
  • Thank u so much. It worked perfectly.
    – Mohid
    Jul 17 '20 at 10:42
  • @TomazicM Please add as an answer
    – Midavalo
    Jul 17 '20 at 17:06
  • 1
    @Midavalo Yes, eternal dilemma what to do when comment (meaningfully) answers the question: flag question as nonreproducible or turn comment into answer. I also prefer later, but usually do it only when asked by person asking question. There should be some policy about that.
    – TomazicM
    Jul 17 '20 at 19:18
2

Leaflet marker .getLatLng() method returns L.LatLng object, which has coordinates in properties .lat and .lng.

Correct reference to start coordinates is then start.lng and start.lat.

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.