Vacuum Interactive Map Card

map-card-predefined-rectangle-label-color
map-card-predefined-rectangle-label-color-selected

great thx, that worked!

Hey Piotr,

first of all: Thanks for your awesome work!

Iā€™ve been using your Interactive Map Card for quite a while on my wall dashboard - a tablet running kiosk browser. Since a couple of weeks it kind of broke without changing anything in the config:

The strange thing is that the card still works like intended when opened on my desktop browser:

Do you happen to have any idea what might be causing this issue? I tried all the common attempts like restarting the tablet, deleting cache, relogging in the kiosk browser app etc.

Full config:

        cards:
          - type: custom:xiaomi-vacuum-map-card
            entity: vacuum.gisela
            map_locked: true
            map_source:
              camera: camera.xiaomi_cloud_map_extractor
            calibration_source:
              camera: true
            append_tiles: true
            tiles:
              - entity: sensor.gisela_last_clean_start_formatiert
                label: Letzter Reinigungsbeginn
                icon: mdi:clock-time-twelf
                unit: null
              - entity: sensor.gisela_last_clean_end_formatiert
                label: Letztes Reinigungsende
                icon: mdi:clock-time-twelf
                unit: null
              - entity: sensor.gisela_last_clean_duration
                label: Letzte Reinigungsdauer
                icon: mdi:timer-sand
                unit: s
              - entity: input_number.gisela_bin_level
                label: StaubbehƤlter FĆ¼llstatus
                icon: mdi:trash-can-outline
                unit: Prozent
            map_modes:
              - template: vacuum_goto
              - template: vacuum_clean_zone
              - template: vacuum_clean_segment
                predefined_selections:
                  - id: 20
                    label:
                      text: Wohnzimmer
                      x: 27325
                      'y': 18275
                      offset_y: 35
                    icon:
                      name: mdi:broom
                      x: 27325
                      'y': 18275
                  - id: 17
                    label:
                      text: Schlafzimmer
                      x: 26475
                      'y': 24100
                      offset_y: 35
                    icon:
                      name: mdi:broom
                      x: 26475
                      'y': 24100
                  - id: 18
                    label:
                      text: Badezimmer
                      x: 27050
                      'y': 22375
                      offset_y: 35
                    icon:
                      name: mdi:broom
                      x: 27050
                      'y': 22375
                  - id: 19
                    label:
                      text: Flur
                      x: 28950
                      'y': 23100
                      offset_y: 35
                    icon:
                      name: mdi:broom
                      x: 28950
                      'y': 23100
                  - id: 16
                    label:
                      text: KĆ¼che
                      x: 28675
                      'y': 25650
                      offset_y: 35
                    icon:
                      name: mdi:broom
                      x: 28675
                      'y': 25650
            card_mod:
              style: |
                ha-card {
                  display: flex !important;
                  align-items: stretch;
                  flex-wrap: wrap;
                  justify-content: space-evenly;
                }
                #map-wrapper {
                  flex-grow: 3;
                  width: 600px;
                }
                .controls-wrapper {
                  flex-grow: 1;
                  width: 100px;
                }
                .room-wrapper {
                --map-card-internal-room-label-color: white;
                --map-card-internal-room-label-font-size: 16px;
                }

Any hint is appreciated!

Best regards,
Stefan

map_image and map_camera are properties that were used in v1.x.x versions of a card. Maybe you have two versions installed at once (via HACS and manually)?

1 Like

Not that I know of. There is only one folder in custom_lovelace.

I just checked again:

Itā€™s working like intended on my Desktop PCs browser.
It shows the error on both my wall dashboard in kiosk browser and in the Home Assistant app on my mobile phone.

Iā€™m at a loss what could cause this on my mobile devices.

ok, so do you have it installed using HACS or manually?

1 Like

I used HACS to install it.

Ok, so what do you have in custom_lovelace?

1 Like

Well. Thanks a lot Piotr!

There was actually a folder called xiaomi_vacuum_map_card dated back to 2021. After deleting and restarting everything worked again on my mobile devices! I still donā€™t know why it didnā€™t affect my desktop browser, but whatever.

Thanks again for your quick help!

Best regards
Stefan

It probably was caused by order of loading resources. You might also check out if URL of this old version is present in dashboardā€™s resources and remove it.

Hi,
i am new with Homeassistant and I have only a few Skills :wink:

Now the Problemsā€¦

I have 2 Vacuum Cleaner a Xiaomi S5 and and a Dream W10 proā€¦

I can I get the the maps? Her is my Config:

camera:

  • platform: xiaomi_cloud_map_extractor
    host: IP Xiaomi
    token: xxx
    username: mail
    password: PW
    name: Xiaomi Schlafzimmer
    draw: [ā€˜allā€™]
    attributes:

    • calibration_points
  • platform: xiaomi_cloud_map_extractor
    host: IP Dream
    token: xxxxx
    username: mail
    password: PW
    name: Xiaomi Erdgeschoss
    country: ā€œdeā€
    scan_interval: 20
    store_map_raw: true
    store_map_path: ā€œ/tmpā€
    force_api: dreame
    draw: [ā€˜allā€™]
    attributes:

    • calibration_points

How can I get access to the 2 Maps? What is wrong?

And there I no god Access to the Dreameā€¦I have onlyā€¦a Config menuā€¦but how can I send a command like audio_location via script?

Thanks for Help

Xiaomi Cloud Map Extractor only retrieves map data, it canā€™t control your vacuum. To control your vacuum from HA you need to find an integration that supports it.

I have also no Mapdata from my W10 only from the S5

Hi all,
It seems that my integration broke and I canā€™t retrieve my map.
I didnā€™t change the config.yml in more than a year, this is how it looks:

vacuum:
  - platform: xiaomi_miio
    host: 192.168.86.37
    token: !secret vacuum_token
camera:
  - platform: xiaomi_cloud_map_extractor
    host: 192.168.86.37
    token: !secret vacuum_token
    username: !secret xiaomi_cloud_username
    password: !secret xiaomi_cloud_password
    colors:
      color_path: [255, 255, 255]
    draw: ['all']
    map_transformation:
      scale: 1
      trim:
        top: 20
        bottom: 20
        left: 20
        right: 20
    attributes:
      - calibration_points  
    country: "us"
    name: "Vacuum Camera"
    auto_update: true
    store_map_raw: false
    store_map_image: true
    store_map_path: "/config/tmp"
    force_api: xiaomi
    scan_interval:
      seconds: 600 #10minutes

And this is my card configuration:

Can you please help me to fix it?
Thank you so much in advance.

Please check with Tokens Extractor if token and IP address are still correct.

Hi @3_14 - I am having the same issue as @alfiro - I have gone back and ensured the IP (which I did have to update) and Token are good, I can control the device from the card, but the map extractor is still not working. Mine looks a little different though. Any ideas?

image

EDIT: Disregard - a full restart of Home Assistant was required. Thanks again for such an awesome card.

Would you be so kind to post your yaml as an example? I fail loading the card properly.

Thx!

Para que funcion realmente sierve este script? Se tiene que editar nombre de entidad o algun valor? Hay manera de evitar perder el mapa y sus coordenadas? Muchas veces se reflesa el mapa y cambia su rotacion afectando a todos las coordenas guardadas.

Pueden explicar cual es la funcion de este sensor???

Estoy en la misma situacion, es flustrante hay solucion???