Skip to content

Tarjeta de mapa en Home Assistant (map card)

La tarjeta de mapa se ha consolidado como una herramienta esencial en el mundo digital actual, especialmente para aquellos que desean visualizar entidades o fuentes de geolocalización en un mapa interactivo, brindando una perspectiva clara y concisa de la ubicación y movimiento de diferentes entidades. Esta herramienta no solo facilita la visualización, sino que también mejora la interacción del usuario, permitiéndole obtener detalles específicos al interactuar con el mapa. Sin embargo, surge una pregunta crucial: ¿cómo añadirla a nuestra interfaz de usuario y cuáles son las distintas opciones y configuraciones que nos ofrece para adaptarse a nuestras necesidades específicas? La respuesta es más sencilla de lo que parece y, en los siguientes apartados, te guiaré paso a paso sobre cómo hacerlo.

Índice de contenido

    Configuración YAML para la tarjeta de mapa

    Si eres fanático de usar el modo YAML o simplemente prefieres utilizar YAML en el Editor de Código en la UI, aquí te presento las opciones que tienes disponibles:

    Variables de configuración

    • type (cadena REQUERIDA): Representa el tipo de tarjeta, en este caso, «mapa».
    • entities (lista REQUERIDA): Lista de IDs de entidades o objetos de entidades. Es necesario definir esto o la opción de configuración «geo_location_sources».
    • geo_location_sources (lista REQUERIDA): Lista de fuentes de geolocalización. Define «all» para usar todas las fuentes disponibles.
    • auto_fit (booleano, opcional): Si está activado, el mapa seguirá las entidades en movimiento ajustando el viewport.
    • title (cadena, opcional): Título de la tarjeta.
    • aspect_ratio (cadena, opcional): Define la relación de aspecto del mapa.
    • default_zoom (entero, opcional): Nivel de zoom predeterminado del mapa.
    • dark_mode (booleano, opcional): Activa el tema oscuro para el mapa.
    • hours_to_show (entero, opcional): Muestra una ruta de ubicaciones previas en el mapa.

    Nota: Solo las entidades con atributos de latitud y longitud serán mostradas en el mapa.

    Opciones para entidades

    Si defines las entidades como objetos en lugar de cadenas, puedes añadir más personalización:

    • entity (cadena REQUERIDA): ID de la entidad.
    • name (cadena, opcional): Reemplaza la etiqueta predeterminada para el marcador.
    • label_mode (cadena, opcional): Renderiza el estado de la entidad como etiqueta.
    • focus (booleano, opcional): Determina el zoom o ajuste predeterminado del mapa.

    Opciones adicionales para marcadores de entidades en el mapa

    Gracias a las actualizaciones, ahora es posible elegir si deseas que se muestre el nombre de la entidad o su estado en el mapa. Incluso puedes mostrar valores de estado, como precios de gasolina, para ver dónde es más económico.

    Tabla de características principales de la tarjeta de mapa

    Característica (Inglés)Característica (Español)Descripción
    TypeTipoMapa
    entitiesEntidadesIDs o objetos de entidades
    geolocation_sourcesFuentes de geolocalizaciónLista de fuentes o «all»
    auto_fitAuto ajusteSeguimiento de entidades móviles
    aspect_ratioRelación de aspectoPorcentaje o relación
    default_zoomZoom predeterminadoNivel de zoom inicial
    dark_modeModo oscuroTema oscuro activable
    hours_to_showHoras para mostrarRuta de ubicaciones previas

    Códigos de ejemplo para crear la tarjeta de mapa (map card)

    type: map
    default_zoom: 12
    entities:
      - entity: sensor.petrem_sarria_95
        label_mode: state
      - entity: sensor.cepsa_pont_de_la_barca_95
        label_mode: state

    *El label_mode hay que ponerlo en todos los sensores. Este ejemplo lo vimos en cómo geolocalizar los sensores de gasolinera en nuestro Home Assistant.

    type: map
    entities:
      - device_tracker.usuario_ejemplo
      - entity: sensor.estacion_gasolina_precio
        label_mode: state
        focus: false
    hours_to_show: 48
    
    type: map
    aspect_ratio: 16:9
    default_zoom: 8
    auto_fit: true
    entities:
      - device_tracker.usuario_ejemplo
      - zone.oficina
    
    type: map
    geo_location_sources:
      - servicio_incendios_rural
    entities:
      - zone.oficina
    

    Personalización de la Apariencia del Mapa

    1. Modo Oscuro

    Como ya hemos mencionado, puedes activar el dark_mode para que tu mapa tenga un tema oscuro.

    type: map dark_mode: true entities: - device_tracker.usuario_ejemplo

    2. Estilo de los Marcadores

    El estilo de los marcadores puede adaptarse según tus preferencias o necesidades. El atributo label_mode permite determinar qué información se mostrará en el marcador:

    • name: Este es el valor predeterminado. Muestra el nombre de la entidad.
    • state: Muestra el estado actual de la entidad. Por ejemplo, para una sensor.estacion_gasolina_precio, mostraría el precio del combustible.
    type: map entities: - entity: sensor.estacion_gasolina_precio label_mode: state

    Nota: Es importante mencionar que el label_mode no se aplica a las entidades de zona, ya que estas no utilizan una etiqueta sino un icono.

    3. Personalizar Colores

    Aunque la personalización directa de colores no está integrada en la tarjeta de mapa, se pueden usar tarjetas personalizadas o complementos de la comunidad.

    4. Aspecto del Mapa

    La relación de aspecto, o aspect_ratio, determina cómo se visualiza el mapa en relación al espacio disponible. Puedes establecerla de dos maneras:

    • Usando un porcentaje para la altura: como «23%».
    • Usando una relación: como «16:9» o «16×9». Si se omite el segundo número, se asumirá «1». Por ejemplo, «1.78» es lo mismo que «1.78:1».
    type: map aspect_ratio: "16:9" entities: - device_tracker.usuario_ejemplo

    5. Zoom Predeterminado

    El nivel de default_zoom determina cuánto se acercará o alejará el mapa inicialmente:

    El rango típico para el zoom va de 1 (vista más alejada) a 20 (vista más cercana).

    type: map
    default_zoom: 8
    entities:
      - device_tracker.usuario_ejemplo
    

    La opción auto_fit ajusta automáticamente el nivel de zoom y el centro del mapa para que incluya todas las entidades visibles. Si se establece en true, el mapa seguirá a las entidades en movimiento, ajustando la vista cada vez que una entidad se actualice.

    type: map
    auto_fit: true
    entities:
      - device_tracker.usuario_ejemplo
    

    Resumen:

    En el mundo digital actual, la tarjeta de mapa en Home Assistant se presenta como una herramienta imprescindible para visualizar y seguir entidades geolocalizadas. Su adaptabilidad permite a los usuarios visualizar, en tiempo real, la ubicación y movimiento de diferentes entidades en un mapa interactivo. A través de la configuración YAML, se pueden personalizar aspectos tales como el tipo de tarjeta, las entidades mostradas, las fuentes de geolocalización, entre otros. Además, se ofrecen opciones para personalizar la apariencia del mapa, como el modo oscuro, estilo de los marcadores y la relación de aspecto. Con códigos de ejemplo y una tabla descriptiva, este artículo provee una guía comprensiva sobre cómo implementar y personalizar la tarjeta de mapa en tu interfaz de Home Assistant, potenciando así tu experiencia y la interacción con las geolocalizaciones.

    Sígueme a YouTube

    Sígueme en YouTube - tarjeta de mapa

    Ajustes