Picture Elements Card - Conditional Based on Entity Attribute

Configuration Frontend
1

Hi,

I’m attempting to create a condition based on an entity attribute in a picture elements card, to show or hide a state-label. It seems it should work, but unfortunately it doesn’t. Can anybody shed some light on it?

This yaml works, but I need the condition to be based on the value of the entity attribute:

  - type: conditional
    conditions:
      - condition: state
        entity: sensor.energy_power_flow_grid_to_house
        state_not: '0'
    elements:
      - type: image
        image: /local/solar/solax-energy-flow-grid-house-02.png
        style:
          top: 56.5%
          left: 26%
          width: 12%
      - type: state-label
        entity: sensor.energy_power_flow_grid_to_house
        suffix: ' W'
        style:
          top: 62%
          left: 26%
          font-size: 13px

This yaml works on a standard conditional card, but as soon as I enter the attribute into the condition on a picture element card, it doesn’t work. Any ideas without creating a template sensor for every attribute?

  - type: conditional
    conditions:
      - condition: state
        entity: sensor.power_flow
        attribute: grid_to_house
        state_not: '0'
    elements:
      - type: image
        image: /local/solar/solax-energy-flow-grid-house-02.png
        style:
          top: 56.5%
          left: 26%
          width: 12%
      - type: state-label
        entity: sensor.power_flow
        attribute: grid_to_house
        suffix: ' W'
        style:
          top: 62%
          left: 26%
          font-size: 13px

Or has the conditional element of the picture element card been left way behind the standard conditional card?

Thanks.

2

Hi @ChequeM8

I can’t see any mention about attributes in the documentation for the conditional element of the picture elements card.

I think you’ll need to make a template sensor to ‘transform’ the attribute into a state.

3

Thanks. It’s a shame it has been left way behind the standard conditional card. Creating 30 separate template sensors to transform the attributes of another sensor into states is a bit crackers.

4

Looking everywhere for a sollution for a problem similar to yours, only to find this post confirming that it doesn’t work using attributes. So I made a feature request for this, please place a vote <3

1 Like
5

Any element may be hidden by using card-mod & “display: none” with a template like

{% if state_attr() === xxxx -%}
display: none;
{%- endif %}

as a workaround.

1 Like
6

Thanks, I’ll try that.

7

Thanks!!! Under appreciated comment. This means I can skip the conditional card altogether and get the same desired behavior.

8

I do not recommend using this way for cards - you may face an extra vertical gap after a hidden card (cannot test it right now - but it was like this some time ago).

10

Sure, it may not lead to pixel perfect results in all cases. I did not exhaustively test. My use case was to hide a graph displayed on a pop-up based on an entity attribute value. It also allowed me to eliminate use of the conditional card for another graph, such that the code for both graphs is now logically consistent. That’s a win for future me when I revisit the code block.