Leaflet Control Layers extended for group of layers and icon legends
Copyright 2014 Stefano Cudini
Tested in Leaflet 0.7
demo:
labs.easyblog.it/maps/leaflet-panel-layers
#Usage
var baseLayers = [
{
name: "OpenStreetMap",
layer: L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png')
},
{
name: 'Outdoor Layers', //separator with label
sep: true
},
{
name: "OpenCycleMap",
layer: L.tileLayer('http://{s}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png')
},
{
name: "Outdoors",
layer: L.tileLayer('http://{s}.tile.thunderforest.com/outdoors/{z}/{x}/{y}.png')
}
];
var overLayers = [
{
name: 'Bike POI', //separator with label
sep: true
},
{
name: "Drinking Water",
icon: '<i class="icon icon-water"></i>',
layer: L.geoJson(WaterGeoJSON)
},
{
name: 'Car POI', //separator with label
sep: true
},
{
name: "Parking",
icon: '<i class="icon icon-parking"></i>',
layer: L.geoJson(ParkingGeoJSON)
}
];
map.addControl( new L.Control.PanelLayers(baseLayers, overLayers, {collapsed: false}) );
#Build
This plugin support Grunt for building process. Therefore the deployment require NPM installed in your system. After you've made sure to have npm working, run this in command line:
npm install
grunt