title: Leaflet layer control for basemap group layers
body: <p>Succinctly, I need groups of layers to be controlled by the leaflet layer control, two to three at a time. In this <a href="http://jsfiddle.net/knu2xs/FH9VF/3/" rel="noreferrer" title="JSFiddle">JSFiddle</a>, when changing basemaps, the hydro overlay needs to persistently stay on top of the various basemaps.</p>
  
  <p>If you run and use the layer control in the top right, you will notice how the hydro overlay will turn off when you switch to imagery and will stay off unless you switch to topographic and back to national geographic. This is the behavior I have been able to reliably reproduce. If you play with it, you can see some pretty weird stuff is going on.</p>
  
  <p>Any input or suggestions for better ways to accomplish this are welcome. The solution does need to use the layer control to switch the basemap while keeping the hydro overlay on top. Otherwise, I am completely open to alternative solutions.</p>
  
  <p>If you are curious before jumping over to the <a href="http://jsfiddle.net/knu2xs/FH9VF/3/" rel="noreferrer" title="JSFiddle">JSFiddle</a>, here is the JavaScript...</p>
  
  <pre><code>// initialize map
  var map = L.map('map', {
      center: [45.7067, -121.5217], // Hood River, OR
      zoom: 7
  });
  
  // hydrology overlay layer
  var hydro = L.esri.tiledMapLayer('http://hydrology.esri.com/arcgis/rest/services/WorldHydroReferenceOverlay/MapServer');
  
  // basemap layer groups so the hydro overlay always overlays the various basemaps
  var nationalGeographic = L.layerGroup([
          hydro,
          L.esri.basemapLayer('NationalGeographic')
      ]),
      esriTopo = L.layerGroup([
          hydro,
          L.esri.basemapLayer('Topographic')
      ]),
      esriShadedRelief = L.layerGroup([
          L.esri.tiledMapLayer('ShadedReliefLabels'),
          hydro,
          L.esri.basemapLayer('ShadedRelief')
      ]),
      esriImagery = L.layerGroup([
          hydro,
          L.esri.basemapLayer('Imagery')
      ]);
  
  // add default layers to map
  map.addLayer(esriTopo);
  
  // json object for layer switcher control basemaps
  var baseLayers = {
      "National Geographic": nationalGeographic,
      "Esri Topographic": esriTopo,
      "Shaded Relief": esriShadedRelief,
      "Imagery": esriImagery
  };
  
  // add layer groups to layer switcher control
  var controlLayers = L.control.layers(baseLayers).addTo(map);
  </code></pre>