Using Layers

If your map includes a lot of overlays or markers, you may want a way of turning groups of them on or off to show or hide detail on the map using layers. When you specify layer names, a new icon appears in the top right corner of the map allowing you to toggle the individual layers on and off. There are two parts to setting this: defining the layer names, and assigning markers and routes to the layers.

layers="Civil Parish|-Ecclesiastical Parish|-School Catchment"

This defines three layers, in this case showing different boundaries. The first one is initially on and the second two are initially not shown, indicated by the leading - sign.

If the layer list is preceded by a leading + sign, the list will always show in the open state on the map, rather than as a button to open the list.

layers="+Civil Parish|-Ecclesiastical Parish|-School Catchment"

When adding the KML files which define these boundaries, we need to specify which layer number to assign them to. The first is layer 1, etc. We may also want to use different colours.

The layer number (or group) is indicated by the $ value in the shortcode. If you are using JSON then it uses the "layer" key.

The layer colour can be any HTML colour name or HTML # code. Precede this with ! in the shortcode or "color" in a JSON file (note the US spelling of the key name).

kml="https://example.com/civil_parish.kml$1!red|https://example.com/ecc_parish.kml$2!purple| https://example.com/school_catch.kml$3!#804467"

You can of course assign multiple items to a layer, such as a group of markers, and you can mix markers and routes within a layer. Items assigned to layer 0, or not assigned to a layer at all, are always shown.

This example shows three different boundaries and the differences between them. Click on the layers button in the top right corner to switch layers on and off.

[osmap kml="https://skirridsystems.co.uk/wp-content/uploads/ComptonandShawfordOSM.kml$1!#00ff88|https://skirridsystems.co.uk/wp-content/uploads/HCCSchoolCatchmentOSM.kml$2!#8800ff|https://skirridsystems.co.uk/wp-content/uploads/ChurchParishBoundaryOSM.kml$3!#ff8800" layers="Civil Parish Boundary|-School catchment - HCC version|-Ecclesiastical parish boundary"]

This is an example of using layers with markers, dividing the three ranges of the Welsh 3000s using the “layer” key in the JSON file.

[osmap height=600 markerfile="https://skirridsystems.co.uk/wp-content/uploads/welsh-3000s.json" layers="Snowdon|Glyderau|Carneddau"]