Replacing legend item names in Carto VL

Question

I am trying to replace legend item names in a Carto VL map. Using an example from the documentation which describes how to rename the "CARTO_VL_OTHERS" category, I was able to rename one of my legend items. For example:

colorLegendList +=
            `<li><span class="point-mark" style="background-color:${color};border: 1px solid black;"></span> 
                <span>${legend.key.replace("EN", "Endangered")}</span></li>\n`;

Which results in:

How would I rename the rest of the legend items as:

• VU - Vulnerable
• CR - Critically Endangered
• LT - Least Threatened

Answer 1

You could create an Object before layer.on('loaded'... with the legend keys you want to use for this dataset, for example:

    const LEGEND_KEYS = {
      LT: 'Least Threatened',
      VU: 'Vulnerable',
      CR: 'Critically Endangered',
      EN: 'Endangered'
    }

And then, when updating the legend:

colorLegendList +=
            `<li><span class="point-mark" style="background-color:${color};border: 1px solid black;"></span> 
                <span>${LEGEND_KEYS[legend.key]}</span></li>\n`;