Problem with adding picture-entity

Configuration Frontend
1

Hi, I have a one panel dashboard and want to add a picture-entity to it in the RAW editor.

This is my code

          - type: picture-entity
            entity: switch.ext_leuchtreklame_fe_tb
            style:
              top: 60.5%
              left: 50.7%
            state_image:
              'on': /local/Images/Logo.jpg
              'off': /local/Images/Logo_Glow.png

When I save the editor this comes up:
image

Anyone knows what I am doing wrong?

2

This code does not belong to picture-entity.
Unless you are trying to paste the card into picture-elements - which you you have not said.

3

My code looks like this

title: Home
views:
  - theme: Backend-selected
    type: panel
    title: Erdgeschoss
    path: floorplan
    icon: ''
    badges: []
    cards:
      - type: picture-elements
        elements:
          - type: picture-entity
            entity: switch.ext_leuchtreklame_fe_tb
            style:
              top: 60.5%
              left: 50.7%
            state_image:
              'on': /local/Images/Logo.jpg
              'off': /local/Images/Logo_Glow.png
          - type: state-badge
            entity: camera.g4_bullet_high_1
            style:
              top: 17%
              left: 32%
          - type: state-badge
            entity: camera.g4_bullet_high_2
            style:
              top: 54%
              left: 96%
          - type: state-badge
            entity: camera.g4_bullet_high_3
            style:
              top: 20%
              left: 60%
          - type: state-icon
            entity: binary_sensor.fs_buromontage01_contact
            style:
              top: 75.5%
              left: 15.7%
              '--paper-item-icon-active-color': red
              '--paper-item-icon-color': green
          - type: state-icon
            entity: binary_sensor.fs_buromontage02_contact
            style:
              top: 72.5%
              left: 15.7%
              '--paper-item-icon-active-color': red
              '--paper-item-icon-color': green

On the dashboard it looks like this

image
image901×521 102 KB

When I don’t put the top and left options the error will be in the left bottom corner

4

Picture-elements card may include other cards - but only custom ones.
There is a workaround - you may wrap your picture-entity inside a custom:hui-element card.

image
image979×684 23.9 KB

  - type: custom:hui-element
    card_type: picture-entity
    entity: sun.sun
    image: /local/images/test/blue.jpg
    style:
      top: 60.5%
      left: 50.7%
5

Hi and thank you very much for that example. Sorry for replying so late, other work came in.

I get this Error trying it:
image

Here is my complete code on a test dashboard

title: Home2
views:
  - theme: Backend-selected
    type: panel
    title: Erdgeschoss
    path: floorplan
    icon: ''
    badges: []
    cards:
      - type: picture-elements
        elements:
          - type: custom:hui-element
            card_type: picture-entity
            entity: sun.sun
            image: /local/images/test/blue.jpg
            style:
              top: 60.5%
              left: 50.7%
        image: \local\Images\E.png
6

Install this custom card.

7

Sorry, I am really a noob at this.
What do you mean with “install this custom card”?

I did a google search and tried this:

But it still doesn’t work

(just to show you I did what they said on the site

image
image1352×673 49.4 KB

8

I found a solution and it was quite easy

All needed was this:

- type: image
            entity: switch.ext_leuchtreklame_fe_tb
            image: /local/Images/Glow.png
            state_image:
              'off': /local/Images/NoGlow.png
            style:
              top: 60%
              left: 50%
              width: 10%