Leaflet layerGroup控件

Question

I have a series of Leaflet FeatureGroups that are made up of a series of GeoJSON layers. The FeatureGroups are conceptually similar but I need them to be separate for certain control reasons. I also need to be able to turn them all on and off at once. Is there a way to do this?

I looked in the documentation and couldn't find an event that fires when the FeatureGroup is switched on and off. There is also no documented way of lumping the FeatureGroups into some kind of superGroup.

For those who want to picture it, here is the workflow:

GeoJSON gets data that is turned into layers in Leaflet. This is of different administration boundaries (eg States, Counties, etc...). Each of the layers goes into a different FeatureGroup based on its type (eg Arkansas and New York go into the State FeatureGroup, Ford and Lincoln counties go into the County FeatureGroup). This way I have control over opacity and styling for the different FeatureGroups (eg when I'm looking at the Counties of a state, I can lower the opacity of all the other states). I also need a way of turning all of this off and back on again. Leaflet provides the ability to do that on a FeatureGroup by FeatureGroup basis, but not a super set of that.

Any ideas on how to achieve this?

---

New version of question:

What is the event that fires when turning a LayerGroup On and Off? Is there anyway to hook into that?

Answer 1

I ended up having my usual LayerGroups or FeatureGroups, and then a FeatureGroup that contains all the layers on all the groups. So when you add a shape or layer to a FeatureGroup, also add it to the FeatureGroup that you are using to keep track of everything. And of course if you remove don't forget to remove it. You can add this base FeatureGroup to the map along with the other groups and it should be fine.

Answer 2

I don't think Leaflet currently provides an event when a LayerGroup is turned on or off (you are talking about with the L.Control, right?). I agree that it would be useful. For now, you can just extend the code to do whatever you need to be done. For example:

var customLayerControl = L.Control.Layer.extend({
  _onInputClick: function(Layer, name){ 
      // This is just like calling super() if this confuses you!
      L.Control.Layers.prototype._onInputClick.call(this,Layer,name);
      // Do stuff
    }
});

Then instead of using the L.Control.Layers, use your custom layer control:

map.addControl(new customLayerControl({}, {'Custom Layer':customLayer},{}));

I hope this helps.