Is there a way to use an input_number as variable for gauge card segments?

Configuration Frontend
1

I was wondering if it’s possible to use an input_number to define the different “from” segments of a gauge card in my Lovelace dashboard? For example, let’s say I have a gauge measuring temperature that 5 segments, red - yellow - green - yellow - red, based on my preferred temperature range. Let’s also say that this range is different during the day and night, or based on the season. I would like the visual segments on my gauge to reflect the changing preferred temperature range.

I already have automations that update input_numbers for preferred maximum temperature and preferred minimum temperature, based on time. Would it then be possible to have the gauge card use these input numbers like this:

cards:
  - type: gauge
    entity: sensor.office_temperature_avg
    name: Temperature
    needle: true
    max: 38
    min: 15
    segments:
      - from: "{{ states('input_number.temp_bad_low') | int }}"
        color: '#db4437'
      - from: "{{ states('input_number.temp_marginal_low') | int }}"
        color: '#ffa600'
      - from: "{{ states('input_number.temp_ideal_low') | int }}"
        color: '#43a047'
      - from: "{{ states('input_number.temp_ideal_high') | int }}"
        color: '#ffa600'
      - from: "{{ states('input_number.temp_marginal_high') | int }}"
        color: '#db4437'
2

Yes but only if you use something like this:

3

Thanks for pointing me in the right direction @tom_l !

I figured I’d share what I came up with in case anyone else is trying to figure out a similar issue. I ended up with slight different helpers than I suggested in my question and a template sensor. This can probably be cleaned up and simplified, but it’s working for me now.

Helpers:

input_number:
  day_temperature:
    name: Day Temperature
    min: 15
    max: 30
    step: 1

input_number:
  Night_temperature:
    name: Night Temperature
    min: 15
    max: 30
    step: 1

# this is turned on and off by day and night cycle automations
input_boolean:
  night_cycle:
    name: Night Cycle
    icon: mdi:moon-new

Temperature Target Template:

- sensor:
    - name: "Temperature Target"
      unique_id: temperature_target
      state: >
        {% set day_temp_target = states('input_number.day_temperature')|int %}
        {% set night_temp_target = states('input_number.night_temperature')|int %}
        {% if states('input_boolean.night_cycle') == 'on' %}
          {{ night_temp_target }}
        {% else %}
          {{ day_temp_target }}
        {% endif %}

YAML for my gauge card:

type: custom:config-template-card
variables:
  - states['sensor.temperature_target']
entities:
  - ${vars[0].entity_id}
card:
  type: gauge
  entity: sensor.office_temperature_avg
  name: Office Temperature
  needle: true
  max: ${parseFloat(vars[0].state) + 15}
  min: ${parseFloat(vars[0].state) - 15}
  segments:
    - from: ${parseFloat(vars[0].state) - 15}
      color: '#db4437'
    - from: ${parseFloat(vars[0].state) - 8}
      color: '#ffa600'
    - from: ${parseFloat(vars[0].state) - 2}
      color: '#43a047'
    - from: ${parseFloat(vars[0].state) + 2}
      color: '#ffa600'
    - from: ${parseFloat(vars[0].state) + 8}
      color: '#db4437'
1 Like
4

Amazing work! @xthursdayx !

I did something similar and it also worked for me, HOWEVER, the needle will not be dynamically updated, I suspect all sensor values will face the same problem, it only updates if you refresh the page. I wonder if you noticed this problem and if you already found a solution, thank you in advance!

5

Hi @marcao88 I actually haven’t seen that issue, sorry… Are you seeing the same problem across different views, e.g. the mobile app vs different browsers? My first suspect would be a problem the browser you’re viewing the gauges from, but if not that, perhaps it has to do with the memory that you home assistant has access to? Sorry I can’t be of more help!

6

Where you ever able to figure this out? Currently experiencing the same issue where the needle isnt being dynamically updated

7

Awesome! Used this for my WiFi BBQ Thermometer. Thanks!

EDIT: but the needle also doesn’t update. haha, so close!

EDIT2: There seems to be a solution for this problem. The card doesn’t update because it monitors only the provided entity. Since the target temperature doesn’t change, the card also doesn’t update. So you just have to add another variable, that contains the value that is monitored, and then it will work. HOWEVER, there is a bug that every time the state changes, a new gauge card is rendered, making the animation appear again, which is quite annoying - but the best we can get, or so it seems.

8

Hello @cstukas, yes, I managed to get it working! It was just a bad configuration from my side.

I could not remember all the details but I am pasting my code as a reference for you, and needle is working dynamically as it should :grin:

              - type: custom:config-template-card
                variables:
                  - states['sensor.pv_smart_production_power']
                entities: # You have to include here everything you wish to be refreshed.
                  - ${vars[0].entity_id}
                  - sensor.house_smart_load # this is my needle.
                card:
                  type: gauge
                  entity: sensor.house_smart_load # this is my needle.
                  name: Energy
                  needle: true
                  max: 5000
                  min: 0
                  segments:
                    - from: 0
                      color: '#ffa600'
                    - from: ${parseFloat(vars[0].state)}
                      color: '#488fc2'
9

Did you find a solution for that? I have exactly the same issue.
Dynamic Max & Segments are working perfectly, however the gauge card is continuously rendering again. The needle changes the whole time from 0 to the updated value instead of the old value to the new.

10

Did you ever work this out? I’m having the same issue:
guage

Replicating Marcoa’s code above didn’t work for me…

11

Hi guys,

has someone found out how to not get the whole gauge-card to be re-drawn when the value changes, ie the needle starts from 0 and moves to the new value, instead of just moving from current to new value ?

12

Hi @MagicJohansson,
@Ildar_Gabdullin found a solution using auto-entities, which is working for me … so you should check that out.
So all credits go to him :clap: :slight_smile:

This is what I am using …

Using severity 
type: custom:auto-entities
card:
  type: vertical-stack
card_param: cards
filter:
  template: |-
    {{
      {
        'type': 'gauge',
        'entity': 'sensor.electricity_meter_huidig_gemiddelde_vraag',
        'name': 'Piekverbruik',
        'needle': 'true',
        'max': (states('sensor.electricity_meter_maximale_vraag_huidige_maand')|float * 1.2),
        'severity': {
          'green': 0,
          'yellow': (states('sensor.electricity_meter_maximale_vraag_huidige_maand')|float * 0.8),
          'red': (states('sensor.electricity_meter_maximale_vraag_huidige_maand')|float)
        },
          
      }
    }},
Using segments 
type: custom:auto-entities
card:
  type: vertical-stack
card_param: cards
filter:
  template: |-
    {{
      {
        'type': 'gauge',
        'entity': 'sensor.electricity_meter_huidig_gemiddelde_vraag',
        'name': 'Piekverbruik',
        'needle': 'true',
        'max': (states('sensor.electricity_meter_maximale_vraag_huidige_maand')|float *1.2),
        'segments': [
            {'from': '0','color':'green'},
            {'from': (states('sensor.electricity_meter_maximale_vraag_huidige_maand')|float * 0.8)  ,'color':'orange'},
            {'from': (states('sensor.electricity_meter_maximale_vraag_huidige_maand')|float) ,'color':'red'},              
          ]
          
      }
    }},
13

Ok, thanks @tvds , I will have a look at that