I'm trying to bine 2 or more overlays into one overlay checkbox. I'm using leaflet layers control with mapbox.js 1.6 to toggle my overlays. It doesn't matter to me if I bine them on mapbox into one data layer, or if I bine separate data layers in my JS code into one overlay checkbox, but I can't seem to do either. I'm exporting MBTiles from Tilemill to my Mapbox account.

Note that it's not an option to:

• bine them in Tilemill (the single zoom level and square bounding box won't work for me across all layers)
• add the various data layers to a single map project on Mapbox (I'd like it to be toggleabe by the user)

I'm trying to bine 2 or more overlays into one overlay checkbox. I'm using leaflet layers control with mapbox.js 1.6 to toggle my overlays. It doesn't matter to me if I bine them on mapbox. into one data layer, or if I bine separate data layers in my JS code into one overlay checkbox, but I can't seem to do either. I'm exporting MBTiles from Tilemill to my Mapbox account.

Note that it's not an option to:

• bine them in Tilemill (the single zoom level and square bounding box won't work for me across all layers)
• add the various data layers to a single map project on Mapbox. (I'd like it to be toggleabe by the user)

• javascript
• leaflet
• mapbox
• tilemill

Share Improve this question Follow edited Jul 25, 2014 at 9:04 sehop asked Jul 25, 2014 at 8:48 sehopsehop 9511 silver badge55 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

You can use L.layerGroup to bine layers

var group = L.LayerGroup([layer1, layer2];

// add default layers to map
map.addLayer(layer1);

// switcher
var baseLayers = {
    "My Group": group,
    // more layers
};

// add layer groups to layer switcher control
var controlLayers = L.control.layers(baseLayers).addTo(map);

You may be interested in this thread Leaflet layer control for basemap group layers

You can use the L.control.layers with the L.layerGroup. Here is the JSFiddle I wrote for this. You can add as many base or overlay layers you want.

Once you create the L.layerGroups, define the base and the overlay layers and add them to the control like this:

var controlLayers = L.control.layers(baseLayers, overlayMaps).addTo(map);