PiotrMachowski/lovelace-xiaomi-vacuum-map-card

Map doesn't render properly

carefulcomputer opened this issue · 3 comments

Checklist

  • I have updated the card to the latest version available
  • I have cleared the cache of my browser
  • I have checked if the problem is already reported

The problem

I see that map is not rendered correctly it only shows a top layer of map. It is same on home assistant companion app and on the browser.

image

What version of a card has described problem?

v2.2.2

What was the last working version card?

No response

What vacuum model do you have problems with?

valetudo/dreame

Which integration do you use to control your vacuum (link)?

https://valetudo.cloud/pages/integrations/home-assistant-integration.html

What browser (browsers/apps) does have this problem?

Chrome

What version of Home Assistant do you use?

2024.6.2

What type of installation are you running?

Home Assistant Container

Card's configuration

type: custom:xiaomi-vacuum-map-card
map_source:
  camera: camera.rosievaccumrobot_camera
calibration_source:
  camera: true
entity: vacuum.valetudo_rosietherobot
vacuum_platform: Hypfer/Valetudo
two_finger_pan: true
map_locked: false
internal_variables:
  topic: homeassistant/RosieTheRobot
map_modes:
  - template: vacuum_clean_segment
    predefined_selections:
      - id: '3'
        icon:
          name: mdi:broom
          x: 3142
          'y': 3520
        label:
          text: Family Room
          x: 3142
          'y': 3520
          offset_y: 35
        outline:
          - - 2990
            - 3345
          - - 3295
            - 3345
          - - 3295
            - 3695
          - - 2990
            - 3695
      - id: '10'
        icon:
          name: mdi:broom
          x: 3010
          'y': 3310
        label:
          text: Lobby
          x: 3010
          'y': 3310
          offset_y: 35
        outline:
          - - 2695
            - 2990
          - - 3325
            - 2990
          - - 3325
            - 3430
          - - 2695
            - 3430
      - id: '4'
        icon:
          name: mdi:broom
          x: 2487
          'y': 3222
        label:
          text: Kitchen
          x: 2487
          'y': 3222
          offset_y: 35
        outline:
          - - 2350
            - 3095
          - - 2625
            - 3095
          - - 2625
            - 3350
          - - 2350
            - 3350
      - id: '5'
        icon:
          name: mdi:broom
          x: 2530
          'y': 3525
        label:
          text: Dining Room
          x: 2530
          'y': 3525
          offset_y: 35
        outline:
          - - 2370
            - 3355
          - - 2690
            - 3355
          - - 2690
            - 3695
          - - 2370
            - 3695
      - id: '7'
        icon:
          name: mdi:broom
          x: 2545
          'y': 2927
        label:
          text: Kitchen Extension
          x: 2545
          'y': 2927
          offset_y: 35
        outline:
          - - 2375
            - 2765
          - - 2715
            - 2765
          - - 2715
            - 3090
          - - 2375
            - 3090
  - template: vacuum_clean_zone
  - template: vacuum_goto

Javascript errors shown in the browser's console (if applicable)

No response

Additional information

No response

Is the image of a camera entity shown differently compared to the card? (In dev tools)

if you mean the entity_picture url attribute of the camera, i copy pasted that link in browser and that shows truncated image too.

No, I mean this page:
Open your Home Assistant instance and show your state developer tools.