lovelace-valetudo-map-card icon indicating copy to clipboard operation
lovelace-valetudo-map-card copied to clipboard

Add possibility to set the floor plan in the background

Open pax2011 opened this issue 6 years ago • 12 comments

I would like to add the map of my house in the background, so that the path of robots are drawn on my map. Maybe setting a fixed point for the charging dock so you can maintain a correct orientation.

pax2011 avatar Oct 12 '19 13:10 pax2011

So, this would just be a background image that you manually created to be displayed below the map, right? Just making sure.

TheLastProject avatar Oct 12 '19 13:10 TheLastProject

Yes exactly! It would also be nice to be able to click the different cleaning areas, but I don't know if it's possible to integrate this.

pax2011 avatar Oct 12 '19 15:10 pax2011

Look at this https://medium.com/@hans.oischinger/zoned-cleanup-with-live-map-922240b4cf8c

pax2011 avatar Oct 12 '19 15:10 pax2011

A single background image would be easy. Different areas are more difficult. But it could be interesting. Maybe I should start with letting people define areas, and then letting people set a picture as background for each area. That way I could ensure pretty good integration of this all

TheLastProject avatar Oct 12 '19 16:10 TheLastProject

It seems a nice solution

pax2011 avatar Oct 12 '19 16:10 pax2011

Sadly, this will have to wait a bit, because my Valetudo locks up when I try to create a zone: https://github.com/Hypfer/Valetudo/issues/344.

After that though, my plan is as follows:

  1. Getting all zones from Valetudo and drawing borders around them on the map of this card
  2. Allow setting things about zones (like colour or background image)
  3. Maybe later, allow selecting them for starting a cleanup

TheLastProject avatar Oct 12 '19 16:10 TheLastProject

Valetudo doesn't yet expose this in MQTT, so this would require calling the API and wouldn't work for MQTT users. So that needs to change first.

TheLastProject avatar May 02 '20 16:05 TheLastProject

https://github.com/TheLastProject/lovelace-valetudo-map-card#displaying-as-overlay may help you. I guess it kinda solves your issue but I still want to add support for zones anyway so I'm leaving this open.

TheLastProject avatar May 21 '20 19:05 TheLastProject

Hi!, Thank you for your gretat work, I'm trying to overlay the vacuum map on my floorplan and detected an awkward behavior of the scaling. If I scale the vacuum map to fit my floorplan as seen on a PC, the vacuum map appears bigger, and offset, when viewed on the HA app on the Phone.

I'm attaching an image with the comparison.

Vacumm_map_verlay_comparison

My config:

  - type: custom:valetudo-map-card
    entity: camera.map_data
    show_floor: false
    background_color: transparent
    wall_opacity: 1
    segment_opacity: 0
    map_scale: 2.32
    icon_scale: 0.8
    vacuum_color: black
    crop:
      top: 0
      bottom: 0
      left: 25
      right: 0
    min_height: 0
    style:
      top: 43%
      left: 56%

Currently I'm using the "style" property to position the map, but I was using left-padding whith simmilar results. The issue apears to be related to the "map_scale" property not scaling with the same proportions as the background.

Regards.

jbabio avatar Dec 06 '21 13:12 jbabio

It would actually be really cool to get some integration between Valetudo and HA Floorplan.

That way I can overlay the robot path/location onto the floorplan and just use that single card.

AngellusMortis avatar Jan 31 '22 03:01 AngellusMortis

https://github.com/TheLastProject/lovelace-valetudo-map-card#displaying-as-overlay may help you. I guess it kinda solves your issue but I still want to add support for zones anyway so I'm leaving this open.

Hi I'm trying to get the map with floorplan overlay working as per the docs, however only the floorplan is showing...

type: picture-elements
elements:
  - type: custom:valetudo-map-card
    entity: camera.valetudo_robotname_map_data
    show_floor: false
    background_color: transparent
    map_scale: 0.8
image: /local/floorplan.png

The only camera entity I have is as above (not camera.map_data as in the docs)

The valetudo-map-card itself works fine in another card

Is there something else I should be doing ?

rjcds avatar Sep 28 '22 11:09 rjcds

https://github.com/TheLastProject/lovelace-valetudo-map-card#displaying-as-overlay may help you. I guess it kinda solves your issue but I still want to add support for zones anyway so I'm leaving this open.

Hi I'm trying to get the map with floorplan overlay working as per the docs, however only the floorplan is showing...

type: picture-elements
elements:
  - type: custom:valetudo-map-card
    entity: camera.valetudo_robotname_map_data
    show_floor: false
    background_color: transparent
    map_scale: 0.8
image: /local/floorplan.png

The only camera entity I have is as above (not camera.map_data as in the docs)

The valetudo-map-card itself works fine in another card

Is there something else I should be doing ?

I had the same issue, it shows, but it is hidden telling you about an undefined camera (you will find it if you inspect the DOM in your browser), anyway this configuration works for me:

  - type: picture-elements
    image: /local/img.png
    elements:
      - type: 'custom:valetudo-map-card'
        vacuum: valetudo_robot
        title: ""
        show_floor: false
        show_walls: false
        show_locate_button: false
        show_start_button: false
        show_battery_level: false
        show_status: false
        rotate: -90
        background_color: transparent
        map_scale: 2.1
        icon_scale: 1.5
        path_opacity: 1
        path_color: "#000"
        min_height: "1w"
        card_mod:
          style: |
            :host {
              position: relative;
              top:48%;
              left:42.5%;
              } 

coxtor avatar Dec 19 '22 22:12 coxtor