简体   繁体   中英

When making a Leaflet map,how can pull and convert the GeoJSON coordinates to a latLng?

I'm making a map using Leaflet , and populating the map with data from a GeoJSON file. I want to use the distanceTo function, but it requires a latLng object. Is there a way to convert the GeoJSON's properties.geometry.coordinates into latLng ?

I have an array of 31 coordinates, from using the push() method on the onEachLayer :

var coords = [];

onEachFeature : function(feature,layer) {
 coords.push(feature.geometry.coordinates)
 //console.log(coords)...

After running that, the coords array is populated with the array for each coordinate. Is there a way to 'convert' this array of arrays to a latLng object so ditanceTo can be used?

End goal is to run the latLng objects through a loop using distanceTo , so that each popup displays the distance from the center point.

     var low = L.geoJson(hosp, {    
     pointToLayer: function(feature,latlng) {
      return L.circleMarker(latlng, {
            color: 'yellow',
             weight: 2,
             fillColor: 'green',
             fillOpacity: .7,
             radius:9

         });
     },

     filter: function (feature, layer) {
         if(feature.properties.DAILY_PAT <= '600'){
             return feature;}
     },


   onEachFeature : function(feature,layer) {
     coords.push(feature.geometry.coordinates)
     //console.log(coords)

     layer.on('click',function(){

       layer.bindPopup("<b>Low Enrollement </b><br>"+"<b>School Name: </b>" 
           + feature.properties.FACILITY_N+"<br><b># of Students: </b>"
           + feature.properties.DAILY_PAT).openPopup()
       });  
     }
    }).addTo(map); 

Why don't you create the coordinates array with Leaflet's LatLng object?

var coords = [];

onEachFeature : function(feature,layer) {
  var coordinates = feature.geometry.coordinates;
  coords.push(L.LatLng(coordinates[1], coordinates[0])); // paramter's depending on your object
}

Then, use somewhat like:

// suppose, centerCoordinates is LatLng object as well
centerCoordinates.distanceTo(coords[0]); 

link to LngLat object on Leaflet: https://leafletjs.com/reference-1.4.0.html#latlng
link to distanceTo method on LngLat : https://leafletjs.com/reference-1.4.0.html#latlng

Since you're spawning L.CircleMarker s, and L.CircleMarker s have a getLatLng() method , you can forego handling the coordinates yourself. Simply refer to the CircleMarker instance when calculating the distance, eg:

onEachFeature : function(feature,layer) {
  var distance = layer.getLatLng().distanceTo(centerPoint);
  layer.on('click',function(){
    layer.bindPopup("Distance to center: " + distance);
  });
}

Note that, in this case, the distance variable exists in a scope unique for each feature, so there's no need for closures . The calls to the onEachFeature() callback act as a closure here.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM