Floorplan now available as a Lovelace card

Hi,
I find a code for navigating between pages, link below.


Also CCOSTAN is using similar type of code in his setup (not a floorplan-card).
However, when I try it comes with an error … maybe some smarter people can figure it out how to use it the right way.

title: Floor Plan Test
type: 'custom:floorplan-card'
config:
  log_level: info
  pages:
    - image: /local/test1.svg?v=1.1.15
      log_level: info
      page_id: page1
      rules:
        - element: button_1a
          action:
            service: floorplan.page_navigate
            data:
              page_id: page3
        - element: button_2a
          action:
            service: floorplan.page_navigate
            data:
              page_id: page2
      stylesheet: /local/style.css?v=1.1.14
    - image: /local/test2.svg?v=1.1.15
      log_level: info
      page_id: page2
      rules:
        - element: button_2a
          action:
            service: floorplan.page_navigate
            data:
              page_id: page3
      stylesheet: /local/style.css?v=1.1.14
    - image: /local/test3.svg?v=1.1.15
      log_level: info
      page_id: page3
      stylesheet:/local/style.css?v=1.1.14
      master_page: 
        content_element: floorplan
      rules:
        - element: button_3a
          action:
            service: floorplan.page_navigate
            data:
              page_id: page1

I manage to toggle a layer in svg file using this:


- elements:
    - toggle_button                   
  action:
    service: floorplan.class_toggle                    
    data:
      classes:
        - layer-hidden                        
        - layer-visible
      default_class: layer-hidden
      elements:
        - page1

where “toggle_button” is the id of the object you use as a button and “page1” is the layer id (saved in inkscape xml), also your css file must include .layer-hidden and .layer-visible.