Is there a standard API or plugin to generate visual colormap/legend from layer paint styles?

[christiandenisi]

Hi MapLibre team,

I have a use case where I would like to automatically generate a visual color scale (e.g., an image, canvas, or SVG) from an existing paint style applied to a vector layer, especially when using expressions like interpolate or step (e.g., in fill-color, circle-color, line-color).

My goals are:
Automatically extract the color mapping from the layer style (paint expressions).

Generate a visual color legend (like a continuous gradient or classified legend) outside the map, as an image or HTML component.

Ideally support both continuous scales (from interpolate) and classified scales (from step).

My questions are:
Does MapLibre GL JS currently offer any internal method, API, or utility for this use case?

Is there any recommended approach, third-party plugin, or pattern used by the community?

Would you consider it in scope to have a utility/helper inside MapLibre GL or as an official companion tool, or do you see this as something to implement custom via Canvas/SVG/D3 externally?

I noticed that similar needs are common in GIS and web mapping (to produce legends consistent with the map styling), but I didn't find explicit reference in the documentation or examples.

Thanks in advance for any guidance or best practice!

[HarelM]

You can take a look at maplibre-awesome, I think one recent project was added there to facilitate a legend creation.
In general, much like the other plugin, you can develop something that will use maplibre in order to create a legend, I'm not sure it fits inside maplibre as everyone has a different view of how a legend should look and behave...

[JinIgarashi]

I have the plugin to generate a simple legend for each layer based on maplibre style definition.

Maplibre GL Legend plugin can be accessed at:

https://github.com/watergis/maplibre-gl-legend

but this plugin does not generate classified legend...

Few month ago, I also developed a feature to generate both raster and vector SVG legend from maplibre style for my current project. But this is too specific for UNDP GeoHub. It uses additional information from titiler (raster sever) and tilestats generated by tippecanoe (vector).

My implementation of SVG legend generator is:

https://github.com/UNDP-Data/geohub/blob/develop/sites/geohub/src/lib/server/helpers/generateLegendFromStyle.ts

You can see how this legend works in GeoHub: https://geohub.data.undp.org/maps/391