Map-card: a slightly improved map-card

@mdijkens @neojudgment: added a new issue for this: Reload entity state & lat/long from Hass websocket subscription · Issue #120 · nathan-gs/ha-map-card · GitHub

@mdijkens @neojudgment it should be fixed in v1.12.0.

Hi Nathan,

I did the update and everything seems to work!

If I see a problem I will send you a feedback

Thank you very much Nathan.

Pascal

1 Like

I’m not sure if this is related or I’m doing something wrong, but the icon does update but moves out of the window.
This is my configuration:

ype: custom:map-card
history_start: 12 hours ago
card_size: 10
zoom: 16
maxZoom: 20
focus_entity: device_tracker.tesla_location
follow_focus: refocus
entities:
  - entity: device_tracker.tesla_location
    size: 40
    color: purple
    history_show_dots: false
    gradual_opacity: 1.4
    display: icon
    history_line_color: green

Also (first time user of the card): can I change the width of the card?
If I increase the size anything above card_size=5 it only increases the hight.

That config looks good, can you share a screenshot of when it moves outside of the map? The follow_focus: refocus should prevent that.

Don’t have a screenshot right now, but what you basically would see is the map centered on the position where the car was when the page was refreshed (manually) for the last time, with the track going outside of the window to the actual position of the car.

I’m on the latest version of HomeAssistant 2025.1.3 using Map Card v1.12.0.
Cleared cache and tried on Safari, Firefox and Edge.

To be fully accurate this my full config currently:


type: custom:map-card
history_start: 12 hours ago
card_size: 6
zoom: 16
maxZoom: 20
focus_entity: device_tracker.tesla_location
follow_focus: refocus
entities:
  - entity: device_tracker.tesla_location
    size: 40
    color: purple
    history_show_dots: false
    gradual_opacity: 1.4
    display: icon
    history_line_color: purple
  - entity: zone.work
    display: icon
    color: green
    size: 30
    focus_on_fit: false
  - entity: zone.home
    display: icon
    size: 30
    focus_on_fit: false

Your device_tracker.tesla_location also needs the focus_on_fit: true.

That doesn’t make a difference unfortunately. I read in the documentation that it is " true" by default anyway?

So I now have this configuration that is only updating the viewport when manually refreshing the browser (I removed the other entities to be sure they don’t interfere).

type: custom:map-card
history_start: 12 hours ago
card_size: 6
zoom: 18
maxZoom: 20
focus_entity: device_tracker.tesla_location
follow_focus: refocus
entities:
  - entity: device_tracker.tesla_location
    focus_on_fit: true
    size: 40
    color: purple
    history_show_dots: false
    gradual_opacity: 1.4
    display: icon
    history_line_color: purple

As said, this does not work unfortunately.
But what is the difference between the working of:
follow_focus: refocus and
follow_focus: contains
(none of these seem to have effect).

Very stupid error in the docs:
It needs to be:
focus_follow: refocus not follow_focus

Will make an update to the docs…!

Adjust your config @Bikey, fixed the README in v1.13.1

Just to comment on this question. I also find this.
I manually add the lines below to my card and it gives me a full view. (Using the sections layout method).

grid_options:
  columns: 45
  rows: 12

@santiniuk that might be a nice thing for the README, do you want to create a github PR for that?

If a “full view” is same as “show for a whole screen”:
then just define “columns: full” like here:

type: custom:map-card
entities: ...
grid_options:
  columns: full
  rows: 8

but a value for “rows” depends on a particular viewport.

Another question is - WTH using sections instead of a Panel view?