Lovely I been looking for something like this just got my gen 1. Some weeks ago
1 Like
Amazing! Works really well. Have a touchscreen in my kitchen and this is 10 times faster than opening the app.
Thanks!
1 Like
@krovachek Great setup!
@caiosweet I am very happy you like it 
@barteke22
Thank you for feedback! Map should be working for all resolutions, itās hard to say what happened in your case, maybe positions from calibrations were not ideal.
Suggestions:
- Thank you for this info, I didnāt know about it. Definitely have to introduce limit.
- Currently order of cleaning is defined by order in configuration, but I also had the same feeling, that it should be ordered according to selection. Added to TODOs
@Tombstone Be careful, as gen1 sometimes likes to rotate the map, in which case you will have to recalibrate card.
@kabuki Iām happy that my card is useful
Another thing, perhaps related to my coordinate issue: I normally have my browser cover only part of the screen, so the cards are slightly smaller. Everything works perfectly, since thatās what I configured it for. But when I maximise my browser and the cards become full size, only presets work correctly.
āGo toā/āZoneā mouse click seems to be off. The first image is the smaller window (I clicked in the corridor, and the circle appeared there). Second if fullscreen, clicked the same location. Not a big issue, but can be annoying if you use multiple window sizes across different devices.
The rotation issue exists (rarely) with S5 as well, reports seem to indicate that it only happens with Regular Cleaning.
Unfortunately this is not related to your coordinate issue. Currently size of map image and coordinate transformation are calculated only at load of card, so after resize everything is a mess :(. This card is my first thing written in JS, so not everything is perfect right now.
About rotation of map, I have S55 since October and my map has never rotated.
I see, well, so long as itās calculated to work with the initial size it should be fine for the most part.
Iāve had mine for a year now and itās rotated like 50+ times. Though Iāve only recently started using the map saving feature. I think getting better internet coverage and making sure itās not too close to the wall when it starts cleaning helped as well.
My biggest gripe with map saving is how inefficiently it splits up the cleaning-zones. I pretty much had to set up this to make it worth it. Without map saving for 110m2: 107min. With map saving: 140+min. Map saving + proper zoning: Less than 100min.
I just have implemented your suggestions, check out newest version of card
- Fixed card resizing issue (still not perfect, but it is definitely better)
- Changed order of cleaning in preselected mode
- Introduced limit for number of zones
1 Like
Amazingā¦
i like it to work in predefined way
1 Like
Very nice card, but I am using HACS, I canāt seem to import the repo into HACS, probably because it needs multiple files to work. Would you want to consider releasing this on HACS? Or could you bundle the files in a single js like some addons do?
Would be amazing. Great card btw!
1 Like
Thanks!
I plan to add all my custom components and cards to HACS, probably next week.
1 Like
Good job! This was awesome! Works like a charm.
Is there any way of setting the size of the map? Or do I just have to make the png a bit wider and recalibrate? The mode-selection goes just below the screen in my iPhone and I would like it to be on one screen.
And another question, can I make the āZonesā option in the mode pulldown menu the default instead of āGo to targetā?
/Fredrik
Nice Btw, I was considering something: Instead of limiting the zones to 5, you could extend them with an automation. However I canāt come up with a good way to make it indefinite (infinite), or how to transfer zone data from your card to the automation.
So for now, this is my default cleaning schedule, which works out perfectly as my house is only 10 zones total. The automation sends the vacuum to do the first 5 zones, and turns on the next automation, which then does the next 5 (once the vacuumās done) and turns itself off.
Maybe you can come up with some way to integrate this with your card, if possible?
- alias: Cleaning Schedule
trigger:
platform: time
at: 08:00:00
condition:
- condition: time
weekday:
- tue
- thu
action:
- service: vacuum.send_command
data:
entity_id: vacuum.xiaomi_vacuum_cleaner
command: app_zoned_clean
params: [[18886,25222,26286,30672,1],
[13872,25643,18822,27343,1],
[12928,23433,13828,26983,1],
[10026,27149,15426,29649,1],
[9978,29732,15378,32532,1]]
- service: automation.turn_on
entity_id: automation.clean_next_5_zones
id: 868c183f0311496f812d5c3f4771303a
- alias: Clean next 5 zones
initial_state: 'off'
trigger:
platform: state
entity_id: vacuum.xiaomi_vacuum_cleaner
from: 'cleaning'
to: 'returning'
condition:
condition: template
value_template: "{{ state_attr('vacuum.xiaomi_vacuum_cleaner', 'battery_level') > 19 }}"
action:
- service: vacuum.pause
data:
entity_id: vacuum.xiaomi_vacuum_cleaner
- delay: '00:00:01'
- service: vacuum.send_command
data:
entity_id: vacuum.xiaomi_vacuum_cleaner
command: app_zoned_clean
params: [[15294,28996,18144,31296,1],
[13867,32540,19817,36890,1],
[11034,32889,13884,36939,1],
[14460,23095,19410,25645,1],
[21386,22704,25486,25154,1]]
- service: automation.turn_off
entity_id: automation.clean_next_5_zones
@Dernebo Iām not sure what you mean by setting size of map. Could you share a screen of your issue?
To change order of options in dropdown you have to reorder them in paper-listbox:
<div class="dropdownWrapper">
<paper-dropdown-menu label="${textMode}" @value-changed="${e => this.modeSelected(e)}" class="vacuumDropdown">
<paper-listbox slot="dropdown-content" class="dropdown-content">
${preselected}
<paper-item>${textGoToTarget}</paper-item>
<paper-item>${textZonedCleanup}</paper-item>
</paper-listbox>
</paper-dropdown-menu>
</div>
@barteke22 I am not sure if it is possible to do this in UI, but will think about it . One hint: you can do it in single automation using wait_template https://www.home-assistant.io/docs/scripts/#wait
The reason theyāre separate is that I donāt want the second part to trigger under other conditions, this way the second part is only on when the first automation triggers (tue+thu at 8am).
And if I want to abort the cleanup I just need to add āautomation offā services to my āreturn to dockā buttons. Maybe thereās some cleaner way to do it, but this works well enough
It seems to work, but canāt test if it functions correctly atm, might need to clear browser cache: If you want a specific choice to be autoselected on start (I have Zones since thatās the most useful for me) add selected=ā0ā (or 1, 2 depending on choice you want) to paper-dropdown-menu and paper-listbox like below:
<div class="dropdownWrapper">
<paper-dropdown-menu selected="0" label="${textMode}" @value-changed="${e => this.modeSelected(e)}" class="vacuumDropdown">
<paper-listbox selected="0" slot="dropdown-content" class="dropdown-content">
${preselected}
<paper-item>${textGoToTarget}</paper-item>
<paper-item>${textZonedCleanup}</paper-item>
</paper-listbox>
</paper-dropdown-menu>
</div>
I have tried your cards lot of times and the different way of cleanigs are work perfectly.
This is the best method that I have seen so far.
What would the code look like if it was written in a HA programming?
I mean if I select rooms with imput booleans for example the the robot cleans the selected areas continously without any break. It is working with node red almost but nobody has solved it with HA automation so far. Please check this tread for example:
I have only one issue with the card: I can not scroll the screen if the pointer is on the map picture.
@krovachek Thank you, it is very nice to hear that you like my solution
- I havenāt tested it, but my idea of solution for selecting zones with input booleans would be something like this:
- service: vacuum.xiaomi_clean_zone data_template: entity_id: vacuum.xiaomi_vacuum repeats: '{{ states.input_number.vacuum_times.state | int }}' zone: {% if is_state('input_boolean.vacuum_room_1', 'on') %} - [13954, 14901, 31754, 32751] {% endif %} {% if is_state('input_boolean.vacuum_room_2', 'on') %} - [23954, 24901, 32754, 32752] {% endif %} {% if is_state('input_boolean.vacuum_room_3', 'on') %} - [33954, 34901, 33754, 32753] {% endif %} - Unfortunately scrolling is disabled to make drawing zones possible. I think it can be enabled in other modes though.
- Card is already in official HACS repo, you should be able to find it in search. If you insist on adding it manually you have to use following address:
https://github.com/PiotrMachowski/lovelace-xiaomi-vacuum-map-card
as HACS doesnāt convert from uppercase itself.
It is working now, thank you!
Iāll try your script, Iām curious 