georgelza
(George)
January 11, 2025, 6:04pm
1
Strange, the same template as per below works on another HA instance, but not on this one, even though the input percentage field is valid…
# Loads default set of integrations. Do not remove.
default_config:
# Load frontend themes from the themes folder
frontend:
themes: !include_dir_merge_named themes
logger:
default: info
logs:
custom_components.load_shedding: debug
recorder:
db_url: mysql://homeassistant:homeassistant@core-mariadb/homeassistant?charset=utf8mb4
auto_purge: true
purge_keep_days: 10
homeassistant:
name: Home-JBay
elevation: 100
unit_system: metric
time_zone: Africa/Johannesburg
country: ZA
# external_url: "https://ha.tinmanza.com"
internal_url: "http://xxx.xx.20.19:8123"
http:
use_x_forwarded_for: true
trusted_proxies:
- 172.16.10.1
- 192.168.0.1
- 173.245.48.0/20
- 103.21.244.0/22
- 103.22.200.0/22
- 103.31.4.0/22
- 141.101.64.0/18
- 108.162.192.0/18
- 190.93.240.0/20
- 188.114.96.0/20
- 197.234.240.0/22
- 198.41.128.0/17
- 162.158.0.0/15
- 104.16.0.0/12
- 172.64.0.0/13
- 131.0.72.0/22
# - 0.0.0.0/0
# - 10.0.0.0/8
# - 127.0.0.1
# - 172.30.33.0/24 # You may also provide the subnet mask
# - 172.16.10.0/24 # Add the IP address of the proxy server
# ssl_certificate: /ssl/fullchain.pem
# ssl_key: /ssl/privkey.pem
template:
- sensor:
- name: "Garage Tank Level Image"
state: >
{% set input_value = states('sensor.garage_tank_percent') | float %}
{% if 0 < input_value < 2.5 %}
{{ "/local/TankLevels0000.jpg" }}
{% elif 2.5 <= input_value < 5 %}
{{ "/local/TankLevels0025.jpg" }}
{% elif 5 <= input_value < 7.5 %}
{{ "/local/TankLevels0050.jpg" }}
{% elif 7.5 <= input_value < 10 %}
{{ "/local/TankLevels0075.jpg" }}
{% elif 10 <= input_value < 12.5 %}
{{ "/local/TankLevels0100.jpg" }}
{% elif 12.5 <= input_value < 15 %}
{{ "/local/TankLevels0125.jpg" }}
{% elif 15 <= input_value < 17.5 %}
{{ "/local/TankLevels0150.jpg" }}
{% elif 17.5 <= input_value < 20 %}
{{ "/local/TankLevels0175.jpg" }}
{% elif 20 <= input_value < 22.5 %}
{{ "/local/TankLevels0200.jpg" }}
{% elif 22.5 <= input_value < 25 %}
{{ "/local/TankLevels0225.jpg" }}
{% elif 25 <= input_value < 27.5 %}
{{ "/local/TankLevels0250.jpg" }}
{% elif 27.5 <= input_value < 30 %}
{{ "/local/TankLevels0275.jpg" }}
{% elif 30 <= input_value < 32.5 %}
{{ "/local/TankLevels0300.jpg" }}
{% elif 32.5 <= input_value < 35 %}
{{ "/local/TankLevels0325.jpg" }}
{% elif 35 <= input_value < 37.5 %}
{{ "/local/TankLevels0350.jpg" }}
{% elif 37.5 <= input_value < 40 %}
{{ "/local/TankLevels0375.jpg" }}
{% elif 40 <= input_value < 42.5 %}
{{ "/local/TankLevels0400.jpg" }}
{% elif 42.5 <= input_value < 45 %}
{{ "/local/TankLevels0425.jpg" }}
{% elif 45 <= input_value < 47.5 %}
{{ "/local/TankLevels0450.jpg" }}
{% elif 47.5 <= input_value < 50 %}
{{ "/local/TankLevels0475.jpg" }}
{% elif 50 <= input_value < 52.5 %}
{{ "/local/TankLevels0500.jpg" }}
{% elif 52.5 <= input_value < 55 %}
{{ "/local/TankLevels0525.jpg" }}
{% elif 55 <= input_value < 57.5 %}
{{ "/local/TankLevels0550.jpg" }}
{% elif 57.5 <= input_value < 60 %}
{{ "/local/TankLevels0575.jpg" }}
{% elif 60 <= input_value < 62.5 %}
{{ "/local/TankLevels0600.jpg" }}
{% elif 62.5 <= input_value < 65 %}
{{ "/local/TankLevels0625.jpg" }}
{% elif 65 <= input_value < 67.5 %}
{{ "/local/TankLevels0650.jpg" }}
{% elif 67.5 <= input_value < 70 %}
{{ "/local/TankLevels0675.jpg" }}
{% elif 70 <= input_value < 72.5 %}
{{ "/local/TankLevels0700.jpg" }}
{% elif 72.5 <= input_value < 75 %}
{{ "/local/TankLevels0725.jpg" }}
{% elif 75 <= input_value < 77.5 %}
{{ "/local/TankLevels0750.jpg" }}
{% elif 77.5 <= input_value < 80 %}
{{ "/local/TankLevels0775.jpg" }}
{% elif 80 <= input_value < 82.5 %}
{{ "/local/TankLevels0800.jpg" }}
{% elif 82.5 <= input_value < 85 %}
{{ "/local/TankLevels0825.jpg" }}
{% elif 85 <= input_value < 87.5 %}
{{ "/local/TankLevels0850.jpg" }}
{% elif 87.5 <= input_value < 90 %}
{{ "/local/TankLevels0875.jpg" }}
{% elif 90 <= input_value < 92.5 %}
{{ "/local/TankLevels0900.jpg" }}
{% elif 92.5 <= input_value < 95 %}
{{ "/local/TankLevels0925.jpg" }}
{% elif 95 <= input_value < 97.5 %}
{{ "/local/TankLevels0950.jpg" }}
{% elif 97.5 <= input_value <= 100 %}
{{ "/local/TankLevels0975.jpg" }}
{% else %}
{{ "/local/TankLevels1000.jpg" }}
{% endif %}
mqtt:
# https://developers.home-assistant.io/docs/core/entity/sensor
sensor:
- state_topic: "home/WaterTankLevels/KenWaterTank_test/json"
name: "Garage Tank - Percent"
unit_of_measurement: '%'
value_template: "{{ value_json.fields.fill_percentage }}"
- state_topic: "home/WaterTankLevels/KenWaterTank_test/json"
name: "Garage Tank - Litre"
unit_of_measurement: 'L'
value_template: "{{ value_json.fields.water_volume }}"
- state_topic: "home/WaterTankLevels/KenWaterTank_test/json"
name: "Garage Tank - Cm"
unit_of_measurement: 'cm'
value_template: "{{ value_json.fields.water_level }}"
- state_topic: "home/WaterTankLevels/KenWaterTank_test/json"
name: "Garage Tank - Value"
value_template: "{{ value_json.fields.value }}"
- state_topic: "home/WaterTankLevels/KenWaterTank_test/json"
name: "Garage Tank - Voltage"
unit_of_measurement: 'Voltage'
value_template: "{{ value_json.fields.voltage }}"
- state_topic: "home/WaterTankLevels/KenWaterTank_test/json"
name: "Garage Tank - Last Update"
value_template: "{{ value_json.time }}"
Troon
(Troon)
January 11, 2025, 6:07pm
2
Go to Developer Tools / Template and type in:
{{ states('sensor.garage_tank_percent') }}
What do you get?
georgelza
(George)
January 11, 2025, 6:46pm
3
The correct/Expected value.
G
georgelza
(George)
January 11, 2025, 6:59pm
4
This is actually 2 problems on 2 Rpi, on this one, the template does not results in the correct image name being pushed into the variable.
On the original source Rpi, the template results in the correct image name in the sensor value but this is not then shown… I have checked, the variable is populated with the correct /local/TankLevels0450.jpg value as example.
here is the dashboard code.
type: vertical-stack
cards:
- type: custom:config-template-card
entities:
- sensor.pot_1_level_image
card:
type: picture
image: "{{ states('sensor.pot_1_level_image') }}"
title: Pot 1
- type: entities
entities:
- entity: sensor.pot_1_litre
- entity: sensor.pot_1_cm
- entity: sensor.pot_1_percent
checking “{{ states(‘sensor.pot_1_level_image’) }}” via Developer tools does show the correct file location/name.
georgelza
(George)
January 11, 2025, 7:01pm
5
I got a water tank image, see below… at 2.5% increments, happy to share with anyone thats able to help me get this working.
G
georgelza
(George)
January 11, 2025, 7:05pm
6
Retyping, copying etc etc, you know redoing something you’ve done 20 times for another time results in variable being created with the correct file name inserted.
Now to try and get the image displayed.
G
type: vertical-stack
cards:
- type: custom:config-template-card
entities:
- sensor.garage_tank_level_image
card:
type: picture
image: "{{ states('sensor.garage_tank_level_image') }}"
title: Garage Tank
- type: entities
entities:
- entity: sensor.garage_tank_litre
name: Volume
- entity: sensor.garage_tank_cm
name: Water Level (Cm)
- entity: sensor.garage_tank_percent
name: Fill Percentage
- type: entities
entities:
- entity: sensor.garage_tank_last_update
name: " Last Reading"
Troon
(Troon)
January 11, 2025, 11:37pm
7
The image
of an entities card does not support templates according to the docs:
tom_l
January 12, 2025, 4:02am
8
A template image entity does though.
configuration.yaml
template:
- image:
- name: Tank Level
url: "{{ states('sensor.garage_tank_level_image') }}"
Card:
type: vertical-stack
cards:
- show_state: false
show_name: false
camera_view: auto
entity: image.tank_level
name: Tank Level
type: picture-entity
- type: etc...
1 Like
georgelza
(George)
January 12, 2025, 5:44am
9
Hi Tom.
Here is my copy/implementation of the above… Not sure what I got wrong.
template:
- sensor:
- name: "Garage Tank Level Image"
state: >
{% set input_value = states('sensor.garage_tank_percent') | float %}
{% if 0 < input_value < 2.5 %}
{{ "/local/TankLevels0000.jpg" }}
{% elif 2.5 <= input_value < 5 %}
{{ "/local/TankLevels0025.jpg" }}
{% elif 5 <= input_value < 7.5 %}
{{ "/local/TankLevels0050.jpg" }}
{% elif 7.5 <= input_value < 10 %}
{{ "/local/TankLevels0075.jpg" }}
{% elif 10 <= input_value < 12.5 %}
{{ "/local/TankLevels0100.jpg" }}
{% elif 12.5 <= input_value < 15 %}
{{ "/local/TankLevels0125.jpg" }}
{% elif 15 <= input_value < 17.5 %}
{{ "/local/TankLevels0150.jpg" }}
{% elif 17.5 <= input_value < 20 %}
{{ "/local/TankLevels0175.jpg" }}
{% elif 20 <= input_value < 22.5 %}
{{ "/local/TankLevels0200.jpg" }}
{% elif 22.5 <= input_value < 25 %}
{{ "/local/TankLevels0225.jpg" }}
{% elif 25 <= input_value < 27.5 %}
{{ "/local/TankLevels0250.jpg" }}
{% elif 27.5 <= input_value < 30 %}
{{ "/local/TankLevels0275.jpg" }}
{% elif 30 <= input_value < 32.5 %}
{{ "/local/TankLevels0300.jpg" }}
{% elif 32.5 <= input_value < 35 %}
{{ "/local/TankLevels0325.jpg" }}
{% elif 35 <= input_value < 37.5 %}
{{ "/local/TankLevels0350.jpg" }}
{% elif 37.5 <= input_value < 40 %}
{{ "/local/TankLevels0375.jpg" }}
{% elif 40 <= input_value < 42.5 %}
{{ "/local/TankLevels0400.jpg" }}
{% elif 42.5 <= input_value < 45 %}
{{ "/local/TankLevels0425.jpg" }}
{% elif 45 <= input_value < 47.5 %}
{{ "/local/TankLevels0450.jpg" }}
{% elif 47.5 <= input_value < 50 %}
{{ "/local/TankLevels0475.jpg" }}
{% elif 50 <= input_value < 52.5 %}
{{ "/local/TankLevels0500.jpg" }}
{% elif 52.5 <= input_value < 55 %}
{{ "/local/TankLevels0525.jpg" }}
{% elif 55 <= input_value < 57.5 %}
{{ "/local/TankLevels0550.jpg" }}
{% elif 57.5 <= input_value < 60 %}
{{ "/local/TankLevels0575.jpg" }}
{% elif 60 <= input_value < 62.5 %}
{{ "/local/TankLevels0600.jpg" }}
{% elif 62.5 <= input_value < 65 %}
{{ "/local/TankLevels0625.jpg" }}
{% elif 65 <= input_value < 67.5 %}
{{ "/local/TankLevels0650.jpg" }}
{% elif 67.5 <= input_value < 70 %}
{{ "/local/TankLevels0675.jpg" }}
{% elif 70 <= input_value < 72.5 %}
{{ "/local/TankLevels0700.jpg" }}
{% elif 72.5 <= input_value < 75 %}
{{ "/local/TankLevels0725.jpg" }}
{% elif 75 <= input_value < 77.5 %}
{{ "/local/TankLevels0750.jpg" }}
{% elif 77.5 <= input_value < 80 %}
{{ "/local/TankLevels0775.jpg" }}
{% elif 80 <= input_value < 82.5 %}
{{ "/local/TankLevels0800.jpg" }}
{% elif 82.5 <= input_value < 85 %}
{{ "/local/TankLevels0825.jpg" }}
{% elif 85 <= input_value < 87.5 %}
{{ "/local/TankLevels0850.jpg" }}
{% elif 87.5 <= input_value < 90 %}
{{ "/local/TankLevels0875.jpg" }}
{% elif 90 <= input_value < 92.5 %}
{{ "/local/TankLevels0900.jpg" }}
{% elif 92.5 <= input_value < 95 %}
{{ "/local/TankLevels0925.jpg" }}
{% elif 95 <= input_value < 97.5 %}
{{ "/local/TankLevels0950.jpg" }}
{% elif 97.5 <= input_value <= 100 %}
{{ "/local/TankLevels0975.jpg" }}
{% else %}
{{ "/local/TankLevels1000.jpg" }}
{% endif %}
- image:
- name: Garage Tank Level
url: "{{ states('sensor.garage_tank_level_image') }}"
And Dashboard yaml
type: vertical-stack
cards:
- show_state: false
show_name: false
camera_view: auto
entity: image.garage_tank_level
name: Tank Level
type: picture-entity
- type: entities
entities:
- entity: sensor.garage_tank_litre
name: Volume
- entity: sensor.garage_tank_cm
name: Water Level (Cm)
- entity: sensor.garage_tank_percent
name: Fill Percentage
- type: entities
entities:
- entity: sensor.garage_tank_last_update
name: " Last Reading"
I was expecting to see my image file name when inspecting value of “image.garage_tank_level” ?
tom_l
January 12, 2025, 6:08am
10
If you don’t use the sensor for anything else you can get rid of it and put the template directly in the image template:
template:
- image:
- name: Garage Tank Level
url: >
{% set input_value = states('sensor.garage_tank_percent') | float %}
{% if 0 < input_value < 2.5 %}
{{ "/local/TankLevels0000.jpg" }}
{% elif 2.5 <= input_value < 5 %}
{{ "/local/TankLevels0025.jpg" }}
{% elif 5 <= input_value < 7.5 %}
{{ "/local/TankLevels0050.jpg" }}
{% elif 7.5 <= input_value < 10 %}
{{ "/local/TankLevels0075.jpg" }}
{% elif 10 <= input_value < 12.5 %}
{{ "/local/TankLevels0100.jpg" }}
{% elif 12.5 <= input_value < 15 %}
{{ "/local/TankLevels0125.jpg" }}
{% elif 15 <= input_value < 17.5 %}
{{ "/local/TankLevels0150.jpg" }}
{% elif 17.5 <= input_value < 20 %}
{{ "/local/TankLevels0175.jpg" }}
{% elif 20 <= input_value < 22.5 %}
{{ "/local/TankLevels0200.jpg" }}
{% elif 22.5 <= input_value < 25 %}
{{ "/local/TankLevels0225.jpg" }}
{% elif 25 <= input_value < 27.5 %}
{{ "/local/TankLevels0250.jpg" }}
{% elif 27.5 <= input_value < 30 %}
{{ "/local/TankLevels0275.jpg" }}
{% elif 30 <= input_value < 32.5 %}
{{ "/local/TankLevels0300.jpg" }}
{% elif 32.5 <= input_value < 35 %}
{{ "/local/TankLevels0325.jpg" }}
{% elif 35 <= input_value < 37.5 %}
{{ "/local/TankLevels0350.jpg" }}
{% elif 37.5 <= input_value < 40 %}
{{ "/local/TankLevels0375.jpg" }}
{% elif 40 <= input_value < 42.5 %}
{{ "/local/TankLevels0400.jpg" }}
{% elif 42.5 <= input_value < 45 %}
{{ "/local/TankLevels0425.jpg" }}
{% elif 45 <= input_value < 47.5 %}
{{ "/local/TankLevels0450.jpg" }}
{% elif 47.5 <= input_value < 50 %}
{{ "/local/TankLevels0475.jpg" }}
{% elif 50 <= input_value < 52.5 %}
{{ "/local/TankLevels0500.jpg" }}
{% elif 52.5 <= input_value < 55 %}
{{ "/local/TankLevels0525.jpg" }}
{% elif 55 <= input_value < 57.5 %}
{{ "/local/TankLevels0550.jpg" }}
{% elif 57.5 <= input_value < 60 %}
{{ "/local/TankLevels0575.jpg" }}
{% elif 60 <= input_value < 62.5 %}
{{ "/local/TankLevels0600.jpg" }}
{% elif 62.5 <= input_value < 65 %}
{{ "/local/TankLevels0625.jpg" }}
{% elif 65 <= input_value < 67.5 %}
{{ "/local/TankLevels0650.jpg" }}
{% elif 67.5 <= input_value < 70 %}
{{ "/local/TankLevels0675.jpg" }}
{% elif 70 <= input_value < 72.5 %}
{{ "/local/TankLevels0700.jpg" }}
{% elif 72.5 <= input_value < 75 %}
{{ "/local/TankLevels0725.jpg" }}
{% elif 75 <= input_value < 77.5 %}
{{ "/local/TankLevels0750.jpg" }}
{% elif 77.5 <= input_value < 80 %}
{{ "/local/TankLevels0775.jpg" }}
{% elif 80 <= input_value < 82.5 %}
{{ "/local/TankLevels0800.jpg" }}
{% elif 82.5 <= input_value < 85 %}
{{ "/local/TankLevels0825.jpg" }}
{% elif 85 <= input_value < 87.5 %}
{{ "/local/TankLevels0850.jpg" }}
{% elif 87.5 <= input_value < 90 %}
{{ "/local/TankLevels0875.jpg" }}
{% elif 90 <= input_value < 92.5 %}
{{ "/local/TankLevels0900.jpg" }}
{% elif 92.5 <= input_value < 95 %}
{{ "/local/TankLevels0925.jpg" }}
{% elif 95 <= input_value < 97.5 %}
{{ "/local/TankLevels0950.jpg" }}
{% elif 97.5 <= input_value <= 100 %}
{{ "/local/TankLevels0975.jpg" }}
{% else %}
{{ "/local/TankLevels1000.jpg" }}
{% endif %}
Note that this image won’t have a value until sensor.garage_tank_percent
changes. You can do that manually in Developer Tool → States for testing.
Then check what the image looks like in a card. You cant use the template editor to look at the state of image.garage_tank_level
as its state is the last time it updated, not the image url. It resolves to a picture in an image card, You can see the URL in Developer Tools → States, look at the image’s entity_picture attribute.
The only remaining question is if the image url
option requires a full url (http://…) rather than a path.
georgelza
(George)
January 12, 2025, 6:31am
11
I do use the sensor values in other automations.
Hmm
I can however create 2 sensors from the same Mqtt topic and then use this one in the card… and the other for the automations.
Did think about setting the state… but did not realize that it only will be updated when change…
The other values as in cm, volume etc all chance allot, but the image card only changes at a 2.5% change and that’s def not going to happen on the test system.
G
tom_l
January 12, 2025, 6:34am
12
No the url sensor. Do you use that anywhere other than for the image?
So change it manually in Dev Tools States. For testing. The change gets overridden when it updates or you restart/reload.
georgelza
(George)
January 12, 2025, 6:41am
13
Just cutting my boys hair quickly
As soon as home will try above and report back.
G
georgelza
(George)
January 12, 2025, 8:57am
14
ok, tried the following…
template:
- image:
- name: Garage Tank Level
url: >
{% set input_value = states('sensor.garage_tank_percent') | float %}
{% if 0 < input_value < 2.5 %}
{{ "/local/TankLevels0000.jpg" }}
{% elif 2.5 <= input_value < 5 %}
{{ "/local/TankLevels0025.jpg" }}
{% elif 5 <= input_value < 7.5 %}
{{ "/local/TankLevels0050.jpg" }}
{% elif 7.5 <= input_value < 10 %}
{{ "/local/TankLevels0075.jpg" }}
{% elif 10 <= input_value < 12.5 %}
{{ "/local/TankLevels0100.jpg" }}
{% elif 12.5 <= input_value < 15 %}
{{ "/local/TankLevels0125.jpg" }}
{% elif 15 <= input_value < 17.5 %}
{{ "/local/TankLevels0150.jpg" }}
{% elif 17.5 <= input_value < 20 %}
{{ "/local/TankLevels0175.jpg" }}
{% elif 20 <= input_value < 22.5 %}
{{ "/local/TankLevels0200.jpg" }}
{% elif 22.5 <= input_value < 25 %}
{{ "/local/TankLevels0225.jpg" }}
{% elif 25 <= input_value < 27.5 %}
{{ "/local/TankLevels0250.jpg" }}
{% elif 27.5 <= input_value < 30 %}
{{ "/local/TankLevels0275.jpg" }}
{% elif 30 <= input_value < 32.5 %}
{{ "/local/TankLevels0300.jpg" }}
{% elif 32.5 <= input_value < 35 %}
{{ "/local/TankLevels0325.jpg" }}
{% elif 35 <= input_value < 37.5 %}
{{ "/local/TankLevels0350.jpg" }}
{% elif 37.5 <= input_value < 40 %}
{{ "/local/TankLevels0375.jpg" }}
{% elif 40 <= input_value < 42.5 %}
{{ "/local/TankLevels0400.jpg" }}
{% elif 42.5 <= input_value < 45 %}
{{ "/local/TankLevels0425.jpg" }}
{% elif 45 <= input_value < 47.5 %}
{{ "/local/TankLevels0450.jpg" }}
{% elif 47.5 <= input_value < 50 %}
{{ "/local/TankLevels0475.jpg" }}
{% elif 50 <= input_value < 52.5 %}
{{ "/local/TankLevels0500.jpg" }}
{% elif 52.5 <= input_value < 55 %}
{{ "/local/TankLevels0525.jpg" }}
{% elif 55 <= input_value < 57.5 %}
{{ "/local/TankLevels0550.jpg" }}
{% elif 57.5 <= input_value < 60 %}
{{ "/local/TankLevels0575.jpg" }}
{% elif 60 <= input_value < 62.5 %}
{{ "/local/TankLevels0600.jpg" }}
{% elif 62.5 <= input_value < 65 %}
{{ "/local/TankLevels0625.jpg" }}
{% elif 65 <= input_value < 67.5 %}
{{ "/local/TankLevels0650.jpg" }}
{% elif 67.5 <= input_value < 70 %}
{{ "/local/TankLevels0675.jpg" }}
{% elif 70 <= input_value < 72.5 %}
{{ "/local/TankLevels0700.jpg" }}
{% elif 72.5 <= input_value < 75 %}
{{ "/local/TankLevels0725.jpg" }}
{% elif 75 <= input_value < 77.5 %}
{{ "/local/TankLevels0750.jpg" }}
{% elif 77.5 <= input_value < 80 %}
{{ "/local/TankLevels0775.jpg" }}
{% elif 80 <= input_value < 82.5 %}
{{ "/local/TankLevels0800.jpg" }}
{% elif 82.5 <= input_value < 85 %}
{{ "/local/TankLevels0825.jpg" }}
{% elif 85 <= input_value < 87.5 %}
{{ "/local/TankLevels0850.jpg" }}
{% elif 87.5 <= input_value < 90 %}
{{ "/local/TankLevels0875.jpg" }}
{% elif 90 <= input_value < 92.5 %}
{{ "/local/TankLevels0900.jpg" }}
{% elif 92.5 <= input_value < 95 %}
{{ "/local/TankLevels0925.jpg" }}
{% elif 95 <= input_value < 97.5 %}
{{ "/local/TankLevels0950.jpg" }}
{% elif 97.5 <= input_value <= 100 %}
{{ "/local/TankLevels0975.jpg" }}
{% else %}
{{ "/local/TankLevels1000.jpg" }}
{% endif %}
Dashboard code:
type: vertical-stack
cards:
- show_state: false
show_name: false
camera_view: auto
entity: image.garage_tank_level
name: Tank Level
type: picture-entity
- type: entities
entities:
- entity: sensor.garage_tank_litre
name: Volume
- entity: sensor.garage_tank_cm
name: Water Level (Cm)
- entity: sensor.garage_tank_percent
name: Fill Percentage
- type: entities
entities:
- entity: sensor.garage_tank_last_update
name: " Last Reading"
screen grabs from the values on developer tools.
PS: I did update the input percentage value down to 24.2% which would force a image update, and then saw it re-updated back to the 26.2% as my refresh is 8seconds atm.
tom_l
January 12, 2025, 10:04am
15
Did some searching. A file path is not supported. Has to be a URL. So everywhere you have
{{ "/local/TankLevels... }}
you would need
{{ "http://<ha_ip_address_here>l/config/www/TankLevels...}}
Also you dont need a template for all your outputs, they are just strings, so:
template:
- image:
- name: Garage Tank Level
url: >
{% set input_value = states('sensor.garage_tank_percent') | float %}
{% if 0 < input_value < 2.5 %}
http://<ip_address_here>/config/www/TankLevels0000.jpg
{% elif 2.5 <= input_value < 5 %}
http://<ip_address_here>/config/www/TankLevels0025.jpg
{% elif 5 <= input_value < 7.5 %}
http://<ip_address_here>/config/www/etc...
georgelza
(George)
January 12, 2025, 10:25am
16
tried… direct at browser, not getting image.
http://172.16.20.19/config/www/TankLevels0000.jpg
wonder if something else is the root causing.
images are in …/config/www/*
user and group have read.
I did previously show the image on dashboard via image: /local/TankLevels0000.jpg
G
georgelza
(George)
January 12, 2025, 10:30am
17
I see you specified that url without {{" and "}}
?
G
tom_l
January 12, 2025, 10:40am
18
Yes. The brackets are only required if you need to resolve something (like states()
) you are just outputting a string. So no brackets required.
georgelza
(George)
January 12, 2025, 11:00am
19
thanks for confirming…
I would expect to be able to get to the image if I go http:///config/www/<name.jpg>
G
tom_l
January 12, 2025, 11:04am
20
Actually no. You woould have to use: http://<ipaddress>:<port>/local/<name.jpg>