Added card_set service to set / reset card inside SVG by using foreignObject tag

[johnmph]

Added the card_set service which can be used like that :

startup_action:                                  <- Here it is called at startup but you can call the service on a normal tap_action or other actions
  - action: call-service
     service: floorplan.card_set                 <- The new service
     service_data:
       container_id: CardContainer               <- The ID of the foreignObject tag inside your SVG
       config:                                   <- If you put this, you will set a card inside foreignObject tag, if you don't, you remove any card that may be in foreignObject
         type: map                               <- The type of the card you want to set (mandatory)
         entities:                               <- All that follows is the config for the card (here the config for the map card)
            - zone.home
          aspect_ratio: "2"

service_data:
  - container_id: CardContainer                  <- You can also set multiple cards at once by using array
     config:
       type: map
       entities:
         - zone.home
       aspect_ratio: "2"
  - container_id: CardContainer2
     config:
       type: weather-forecast
       entity: weather.forecast_maison
       forecast_type: daily

Example of a foreignObject tag inside a SVG file :

<foreignObject id="CardContainer" x="996" y="920" width="484" height="242"></foreignObject>

Why this feature ?

Of course, you can add a card normally and use CSS to move card above the SVG but there are at least two caveats :

• The relative position is hard to keep correct when resizing
• In case of a floorplan used as a main card inside a custom ha-dashboard, you can have only one card

[exetico]

Thank you for the effort! 😀

I need to find a bit of time, in order to review it, but I noticed a few things, and also have a few requirements. Maybe I've checked it too fast, but I'll share it.

• Why are config set with ?, but also used in a spread operation in the code
• I spotted a todo in the code: Is that necessary?
• All features needs to be well documented, in order to be merged. We have a history, where the documentation didn't cover all features.
• Are you able to introduce tests in order to test your functionality?
• What HA function did you test this in, and with what cards? Have you personally seen it break, with specific cards?
• Does it handle multiple floorplans, without messing things up?
• Have you tested whether ha-floorplan loosen up the memory footprint, while browsing around, and not spawning cards, over and over again, on state change, or similar?

Let me know what you think. I'd appreciate the input aren't processed by a random LLM agent 👍😁.

[johnmph]

Hello, For the optional config, it is because you can call card_set with a container_id but without config to remove any card inside container_id. The TODO was there because I am not sure if the best category for the "bad container id" log error is CONFIG or FLOORPLAN_ACTION. I will add documentation, in 03-usage.md ? I can check to add tests also, in floorplan-services.test ? I added the card_set service call in the startup to set the card directly and tested with tap_action to change card and to remove a card also, all is fine, tested with original map card and weather-forecast card and also custom map card. I have not tried multiple floorplans but I have checked in the documentation and multiple floorplans is just one svg with multiple layers, is it correct ? If so, I don't see any problem that could happen? My test SVG is a floorplan with already multiple layers with some hidden for the lighting effects. I am not very familiar with browser debugging, and never used typescript before but javascript is garbage collected and there is no reference keep when another card is set or removed, and card is created with official helpers from Home Assistant, so if there are some memory leaks, it will happen in Helpers which I doubt. Thank you Le lun. 1 sept. 2025 à 16:10, Tobias Nordahl Kristensen < ***@***.***> a écrit :

…

*exetico* left a comment (ExperienceLovelace/ha-floorplan#590) <#590 (comment)> Thank you for the effort! 😀 I need to find a bit of time, in order to review it, but I noticed a few things, and also have a few requirements. *Maybe I've checked it too fast, but I'll share it.* - Why are config set with ?, but also used in a spread operation in the code - I spotted a todo in the code: Is that necessary? - All features needs to be well documented, in order to be merged. *We have a history, where the documentation didn't cover all features.* - Are you able to introduce tests in order to test your functionality? - What HA function did you test this in, and with what cards? Have you personally seen it break, with specific cards? - Does it handle multiple floorplans, without messing things up? - Have you tested whether ha-floorplan loosen up the memory footprint, while browsing around, and not spawning cards, over and over again, on state change, or similar? Let me know what you think. *I'd appreciate the input aren't processed by a random LLM agent* 👍😁. — Reply to this email directly, view it on GitHub <#590 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAF3M3ZSNJ3CHK3G52BRZ533QRHTVAVCNFSM6AAAAACFFB5EROVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZTENBSGUZDGOJWGU> . You are receiving this because you authored the thread.Message ID: ***@***.***>

[johnmph]

Just added doc and test ;)

[exetico]

Thank you for adding this. I'll need to test a few things, but expect it to get part of a pre-release in near future.

@OzGav If you have time, it would be helpful to have the following build tested:
https://github.com/ExperienceLovelace/ha-floorplan/actions/runs/17712110372/artifacts/4006502583

You only need to overwrite the floorplan.js file in your setup. But pay attention to caching, as always 😄!

[johnmph]

Thank you very much

[OzGav]

@exetico I don't see anything obviously adverse... All is working fine for me.

[exetico]

Thank you for testing, @OzGav .

[exetico]

Released as part of https://github.com/ExperienceLovelace/ha-floorplan/releases/tag/v1.1.4

@johnmph: Thank you, for your contribution.