color-legend-control.md

Color-legend control

Use

Add a color legend to your map.

Example

Build a color-legend manually:

@controls {
  bottom-left {
    color-legend {
      color {
        value: red;
        label: "All the red things";
      }

      color {
        value: blue;
        label: "All the blue things";
      }
    }
  }
}

Automatically build the color-legend from the element-color value in @settings:

@controls {
  bottom-left {
    color-legend {
      colors: auto;
    }
  }
}

@settings {
  element-color: categorize("Element type", set2);
}

Supported properties

• colors defaults to auto and tries to build the list of colors and labels

The color-legend can be customized using nested color blocks which support the following properties:

• value the color itself ("red" or "#BA462F")
• label the text to put next to the color