Floorplan kleine Frage bzgl. Umsetzung

Dashboard/Cards/Frontend
1

Ich habe meinen Floorplan eine weile am Laufen und würde gerne noch was mit reinbasteln. Mir geht es nur darum ob ich hier richtig denke….

Nachdem ich ja Zustandsgesteuert die Bilder bzgl. Licht an und aus drüber lege, ist mir die Idee gekommen das auch mit den Mülltonnen so zu gestalten. Quasi das im Hof des Hauses am Tag vor der Abholung und am Tag der Abholung die jeweilige Mülltonne (schwarz, blau, braun…) steht.

Nun stell ich mir die Frage wie das Bild denn dann aussehen muss. Gehe ich richtig der annahme damit die Dimension schon mal gleich sein muss, Hintergrund transparent und die Tonne dann an der entsprechenden Stelle? Code ähnlich dann dem Schnippsel den ich hier anhänge. So ist es ja dann mit dem Licht auch gemacht oder sehe ich das falsch ?

type: picture-elements
image: /local/floorplan/transparent.png?version=C8A9834DE49B99CE8CA08C0B974F39B4
elements:
  - type: conditional
    title: Base
    conditions: []
    elements:
      - type: image
        tap_action:
          action: none
        hold_action:
          action: none
        image: /local/floorplan/base.png?version=44556104598CEF4F2DCD48D2C7E7A683
        filter: none
        style:
          left: 50%
          top: 50%
          width: 100%
  - type: conditional
    title: light.steckdose_b2
    conditions:
      - condition: state
        entity: light.steckdose_b2
        state: "on"
    elements:
      - type: image
        tap_action:
          action: none
        hold_action:
          action: none
        image: >-
          /local/floorplan/light.steckdose_b2.png?version=3715AB0E2DBFDA85671639C9DD01CC54
        filter: none
        style:
          left: 50%
          top: 50%
          width: 100%
          mix-blend-mode: lighten

Dashboard start
Dashboard start1646×918 173 KB

Was mich hierbei interessieren würde ist, ob es denn auch möglich ist quasi “nur” die Mülltonne auf das Bild an Position links 30% top 70% z.b. anzeigen zu lassen ohne das ich immer das komplette Bild einblende (wie bei den Lichtern). Welchen mix-blend-mode nutzt man da? Beim licht ist hier ja “lighten” hinterlegt

:crayon:by HarryP: Zusammenführung Doppelpost (bei Änderungen oder hinzufügen von Inhalten bitte die „Bearbeitungsfunktion“ anstatt „Antworten“ zu nutzen)

3

VIEL zu kompliziert gedacht… ging jetzt doch einfacher als erwartet…. die Draufsicht der Tonnen ist jeweils die Datei gelbdrauf.png für Gelb und Draufsicht. Jetzt taucht die Tonnen einen Tag vorher auf und am “Abholtag” etwas weiter unten.

  - type: conditional
    title: Restmüll
    conditions:
      - condition: state
        entity: sensor.restmull
        state: heute
    elements:
      - type: image
        image: /local/floorplan/schwarzdrauf.png
        style:
          left: 40%
          top: 80%
          width: 2.5%
  - type: conditional
    title: Papier
    conditions:
      - condition: state
        entity: sensor.papiertonne
        state: morgen
    elements:
      - type: image
        image: /local/floorplan/blaudrauf.png
        style:
          left: 37%
          top: 70%
          width: 2.5%
  - type: conditional
    title: Biotonne
    conditions:
      - condition: state
        entity: sensor.biotonne
        state: morgen
    elements:
      - type: image
        image: /local/floorplan/braundrauf.png
        style:
          left: 34%
          top: 70%
          width: 2.5%
  - type: conditional
    title: gelber Sack
    conditions:
      - condition: state
        entity: sensor.gelber_sack
        state: morgen
    elements:
      - type: image
        image: /local/floorplan/gelbdrauf.png
        style:
          left: 31%
          top: 70%
          width: 2.5%
  - type: conditional
    title: Restmüll
    conditions:
      - condition: state
        entity: sensor.restmull
        state: morgen
    elements:
      - type: image
        image: /local/floorplan/schwarzdrauf.png
        style:
          left: 40%
          top: 70%
          width: 2.5%