Qué es la leyenda de un mapa: partes, ejemplos y cómo crear una

Todo mapa usa símbolos, y ninguno se explica solo. Una línea azul puede ser un río, una línea de tranvía o una autopista, según quién haya dibujado el mapa. La leyenda del mapa es donde el autor lo deja por escrito.

Esta guía explica qué es la leyenda de un mapa, qué partes necesita, cómo cambia según el tipo de mapa y cómo crear una para un mapa web interactivo, con código.

Qué es la leyenda de un mapa

La leyenda de un mapa es el recuadro que asocia cada símbolo del mapa con una etiqueta que indica qué significa.

La palabra viene del latín legenda, «lo que debe leerse». El nombre encaja: la leyenda es el texto que necesitas antes de que el resto del mapa tenga sentido.

En inglés se habla de map legend y de map key. Algunos manuales de cartografía distinguen entre key, la lista de símbolos, y legend, el recuadro completo con título, unidades y notas. En español, en la escuela y en el software GIS se usa leyenda para todo, y así lo usa este artículo.

Las partes de la leyenda de un mapa

Un mapa solo necesita las partes que usa. Cada símbolo que aparece en el mapa necesita una entrada.

Dos elementos del mapa suelen ir junto a la leyenda sin formar parte de ella. La escala gráfica relaciona la distancia en el mapa con la distancia sobre el terreno. La flecha del norte indica la orientación, algo importante en mapas girados y en mapas dibujados con una proyección poco habitual.

Ejemplos de leyendas según el tipo de mapa

La leyenda sigue a los datos. Un atlas de carreteras y un mapa censal necesitan leyenda, pero cada una resuelve un problema distinto.

Los mapas topográficos tienen leyendas largas. Organismos cartográficos nacionales como el USGS, Ordnance Survey y el IGN publican hojas completas de signos convencionales para curvas de nivel, vegetación, edificios y puntos de referencia. Las curvas de nivel tienen una entrada y una nota sobre la equidistancia, por ejemplo «equidistancia 10 m». La guía de mapas de isolíneas explica cómo leer esas líneas.

Los mapas de carreteras codifican la categoría de la vía con el color y el grosor de la línea. La leyenda enumera las categorías desde la autopista hasta la carretera local, además de símbolos para enlaces, peajes y transbordadores.

Los mapas coropléticos colorean regiones según un valor, así que su leyenda es una escala de color con un rango para cada tono. Los rangos importan tanto como los colores, porque los mismos datos pueden parecer tranquilos o alarmantes según dónde caigan los cortes de clase. La guía de mapas coropléticos explica cómo elegirlos.

Los mapas de calor y los mapas del tiempo muestran una superficie continua. Su leyenda es una barra de degradado con marcas etiquetadas, sin casillas separadas.

Los mapas de símbolos proporcionales escalan un círculo o un cuadrado según el valor. La leyenda muestra tres o cuatro tamaños de referencia para que puedas estimar los valores intermedios.

Los planos de transporte público dan a cada línea su propio color y nombre. La leyenda funciona también como índice de líneas, y las estaciones de correspondencia tienen su propio símbolo.

Para ver más tipos de mapas y cuándo encaja cada uno, consulta tipos de mapas y la guía de mapas temáticos.

Cómo leer la leyenda de un mapa

Cuatro comprobaciones evitan la mayoría de las malas lecturas.

1. Lee el título y la unidad. «Casos» y «casos por cada 100.000 habitantes» producen mapas muy distintos a partir de los mismos datos.
2. Revisa los cortes de clase. Los rangos de anchura desigual, como 0 a 5 junto a 5 a 500, son una opción válida, pero cambian lo que significa cada color. Lee los números antes que los colores.
3. Comprueba cómo escalan los tamaños. Un círculo el doble de ancho ocupa cuatro veces la superficie. Los buenos mapas de símbolos proporcionales escalan por área y muestran círculos de referencia.
4. Busca la fecha y la fuente. Sin fecha, no puedes saber si el mapa sigue describiendo el mundo.

Cómo diseñar una leyenda que funcione

La leyenda forma parte de la interfaz del mapa. Estas reglas vienen de la práctica cartográfica y valen para papel y pantalla.

• Incluye solo lo que aparece en el mapa. En un mapa web, oculta las entradas de las capas desactivadas o no visibles en el nivel de zoom actual.
• Dibuja cada símbolo exactamente como aparece en el mapa. Usa el mismo color, tamaño, trazo y opacidad. Una muestra con opacidad completa junto a un relleno al 80 % no va a coincidir.
• Ordena las entradas por valor o importancia. Coloca las clases cuantitativas de menor a mayor. Pon primero las categorías más importantes.
• Etiqueta los rangos sin huecos ni solapamientos. «Menos de 50, de 50 a 199, 200 o más» asigna a cada valor exactamente una clase.
• Acompaña el color con una segunda pista. Alrededor de 1 de cada 12 hombres y 1 de cada 200 mujeres tienen algún tipo de alteración en la visión del color. Añade etiquetas, tramas o formas de icono distintas, y elige paletas probadas para daltonismo, como las de ColorBrewer.
• Haz que sea más discreta que los datos. Usa texto pequeño, un fondo liso y ningún borde grueso.
• Mantén las etiquetas como texto. El texto HTML se puede traducir, buscar y leer con lectores de pantalla. Una leyenda incrustada en una imagen no permite nada de eso.

Cómo añadir una leyenda a un mapa web

MapLibre GL JS y la mayoría de las librerías de mapas web dan estilo a las capas a partir de un estilo JSON y no dibujan leyendas. La leyenda la construyes tú, como un pequeño panel HTML sobre el mapa.

El riesgo principal es la desincronización: alguien cambia un color o un corte de clase en el estilo y se olvida de la leyenda. Define las clases una sola vez y genera a partir de esa lista tanto el estilo de la capa como la leyenda.

const classes = [
  { min: 0, color: '#edf8e9', label: 'Under 50' },
  { min: 50, color: '#bae4b3', label: '50 to 199' },
  { min: 200, color: '#74c476', label: '200 to 999' },
  { min: 1000, color: '#238b45', label: '1,000 and more' },
];

// 1. Build the layer style from the classes.
const fillColor = ['step', ['get', 'density'], classes[0].color];
for (const c of classes.slice(1)) fillColor.push(c.min, c.color);

map.on('load', () => {
  map.addSource('regions', { type: 'geojson', data: '/data/regions.geojson' });
  map.addLayer({
    id: 'density',
    type: 'fill',
    source: 'regions',
    paint: { 'fill-color': fillColor, 'fill-opacity': 0.8 },
  });
});

// 2. Build the legend from the same classes.
const legend = document.createElement('div');
legend.className = 'map-legend';

const title = document.createElement('h3');
title.textContent = 'People per km², 2024';
legend.append(title);

for (const c of classes) {
  const row = document.createElement('div');
  const swatch = document.createElement('span');
  swatch.style.background = c.color;
  swatch.style.opacity = '0.8'; // match the layer's fill-opacity
  row.append(swatch, c.label);
  legend.append(row);
}

map.getContainer().append(legend);

.map-legend {
  position: absolute;
  bottom: 32px;
  left: 12px;
  padding: 10px 12px;
  background: rgb(255 255 255 / 0.92);
  border-radius: 8px;
  font: 13px/1.5 system-ui, sans-serif;
}
.map-legend h3 { margin: 0 0 6px; font-size: 13px; }
.map-legend span {
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-right: 8px;
  vertical-align: -2px;
  border-radius: 2px;
}

La expresión step asigna el primer color a toda región por debajo de 50 y cambia de color en cada valor min. La leyenda recorre el mismo array classes, así que añadir una quinta clase o cambiar un color actualiza el mapa y la leyenda a la vez. La paleta es la escala Greens de cuatro clases de ColorBrewer. Las etiquetas se asignan con textContent, lo que mantiene la leyenda segura cuando las etiquetas vienen de una API o de datos introducidos por usuarios.

Cuando la leyenda básica funcione, merece la pena añadir tres extensiones:

• Convierte las filas en filtros. Haz de cada fila un botón que llame a map.setFilter sobre la capa, para que la leyenda sirva también como control.
• Sigue el nivel de zoom. Escucha el evento zoomend y oculta las filas de las capas que queden fuera de su minzoom y maxzoom.
• Pliégala en pantallas pequeñas. Envuelve la leyenda en un elemento details con un encabezado summary y tendrás un control accesible para abrirla y cerrarla sin JavaScript adicional.

Dónde encaja MapAtlas

Una leyenda solo puede ser tan coherente como el estilo que tiene detrás. MapAtlas Map Visualization & Styling te da estilos de mapa propios con tus colores, tipografías e iconos, y capas de datos coloreadas por valor. Combínalo con el patrón de leyenda de arriba y el mapa y su leyenda seguirán de acuerdo aunque cambien los datos.