Los controles en OpenLayers son elementos de la interfaz de usuario que permiten a los usuarios interactuar con el mapa. Estos pueden incluir botones, barras de escala, brújulas y otros componentes que mejoran la experiencia de navegación y manipulación del mapa.

Controles Predeterminados

Controles predeterminados que se agregan automáticamente al mapa, algunos de los controles más usados son:

Zoom (ol.control.Zoom): Proporciona botones para acercar y alejar el mapa.
📘 Documentación   🚀 CodePen

// Ejemplo control Zoom
const zoomControl = new ol.control.Zoom({
  className: 'mi-control-zoom', // Clase CSS personalizada
  zoomInLabel: '+',             // Etiqueta del botón de acercar
  zoomOutLabel: '-',            // Etiqueta del botón de alejar
  zoomInTipLabel: 'Acercar',    // Texto de ayuda para acercar
  zoomOutTipLabel: 'Alejar'     // Texto de ayuda para alejar
});

Rotate (ol.control.Rotate): Permite rotar el mapa si la vista está inclinada.
📘 Documentación   🚀 CodePen

// Ejemplo control Rotate
const rotateControl = new ol.control.Rotate({
      className: 'mi-control-rotate', // Clase CSS personalizada
      label: '⟳',                     // Etiqueta del botón de rotar
      tipLabel: 'Restablecer Rotación', // Texto de ayuda para el botón
    }),

Attribution (ol.control.Attribution): Muestra información de atribución sobre las capas y fuentes de datos.
📘 Documentación   🚀 CodePen

const attributionControl = new ol.control.Attribution({
      collapsible: true,               // Permitir colapsar el control
      collapsed: false,                // Mostrarlo expandido por defecto
      tipLabel: 'Mostrar Atribuciones', // Texto de ayuda
    }),

ScaleLine (ol.control.ScaleLine): Muestra una barra de escala que indica la relación de distancia en el mapa.
📘 Documentación   🚀 CodePen

const scaleLineControl = new ol.control.ScaleLine({
      units: 'metric', // Unidades (metric o imperial)
      minWidth: 100,   // Ancho mínimo en píxeles
    }),

Controles Personalizados

Se pueden crear controles personalizados extendiendo de la clase ol.control.Control.
🚀 CodePen