how to select a specific route on leaflet?

问题

I want to draw a map with few routes drawn on it.

I want to have a dropbox with numbers 1,..,n

when an item in the dropbox is chosen, the corresponding route is highlighted on the map.

I have started using "leaflet".

1) how do i choose with js a specific feature (e.g. line) on map?

I saw how to filter from a features collection, but not how to select from all features on the map (say by property X)

$('select[name="dropdown"]').change(function() {

  var item = $(this).val();
  alert("call the do something function on option " + item);
  //how to make the chosen line highlighted ??

});

回答1:

What I got from your other question is that your routes are coming from a GeoJSON file and each feature has a property "id".

You can use Leaflet's geoJson.foreach to iterate over all features. With each feature you then check if it matches the criteria you are looking for, in your case compare the selection option's value to the GeoJSON feature id.

By putting var geojson; outside of the loadMap() function you are making it globally accessible and it can be used in the jQuery function.

$('select[name="dropdown"]').change(function() {
  var item = $(this).val();

  geojson.eachLayer(function (layer) {
    try {
      if(layer.feature.geometry.properties.id == item){
        highlightFeature({ "target": layer })
      } else {
        resetHighlight({ "target": layer })
      }
    } catch(e) {}
  });
});

Demo: http://plnkr.co/edit/NBTLbs?p=preview

来源：https://stackoverflow.com/questions/35071164/how-to-select-a-specific-route-on-leaflet