Did you put the file in your /www/gauge-card.js ?
is /config/ on hassio or /home/homeassistant/.homeassistant/ in hassbian
Works on chrome out of the box, but for firefox you need to enable two custom flags in about:config
yes, I run under docker and is in /config/www/gauge-card.js
Can you please make a screenshot of the full JS error? If it’s a stacktrace, make sure you expand it
something may have happened when I upgraded to 0.73.1. My other custom_ui state cards for sliders on lights are also not working.
almost like it can’t read whats in /config/www.
1 Like
I’m having some strange behavior when loading the lovelace with gauge, it shows the error for a second and then the normal gauge appears correct, see below:
And the error that printed is:
Yes, this is the behaviour seen with any custom cards. It only happens on a full browser refresh until the JS files are cached.
Maybe in a future release of HA this will get polished a bit, but it’s nothing to worry about for now.
No, it happens also on regular refresh as well (F5 or ctrl+r)
I just spent a lot of time with this, because there is one important point missing in documentation.
When you created the www folder, because it was missing there, you have to restart homeassistant.
I will add that to the FAQ
1 Like
I restarted it like thousand times already 
still appears the same like this (on each page load and for a regular F5 refresh as well):
Thanks. Love the gauges. Added gauge to Tesla battery and total power usage for the house. Looks great
4 Likes
Do you mind sharing your config for the tesla card?
no problem Just change VIN to your cars vin number and image to a picture of the car in correct color you want to use.
cards:
- type: vertical-stack
cards:
- type: picture-entity
title: Tesla Model S
image: /local/lovelace/tesla_black.jpg
entity: sensor.tesla_model_s_VIN_mileage_sensor
name: Milage
- type: custom:gauge-card
title: Battery
entity: sensor.tesla_model_s_VIN_battery_sensor
min: 0
max: 100
severity:
green: 50
yellow: 20
red: 0
- type: glance
entities:
- sensor.tesla_model_s_VIN_range_sensor
- switch.tesla_model_s_VIN_charger_switch
- binary_sensor.tesla_model_s_VIN_charger_sensor
- type: glance
entities:
- entity: sensor.tesla_model_s_VIN_temperature_sensor_inside
name: Inside
- entity: sensor.tesla_model_s_VIN_temperature_sensor_outside
name: Outside
- climate.tesla_model_s_VIN_hvac_climate_system
- input_datetime.tesla_climate_timer
- input_boolean.climate_timer
- type: history-graph
title: Battery Status
entities:
- sensor.tesla_model_s_VIN_battery_sensor
4 Likes
I’m new to HA and even newer to Lovelace. In attempting to implement this, the gauges are showing as below. Any help would be appreciated.
My ui-lovelace is as follows:
- title: Weather
cards:
- type: custom:gauge-card
title: Outdoor Temperature
entity: sensor.outside_temp
min: -20
max: 110
severity:
red: 90
amber: 85
green: 60
blue: 0
- type: custom:gauge-card
title: Outdoor Humidity
entity: sensor.outside_humidity
severity:
red: 75
green: 0
amber: 65
and my sensors.yaml looks like:
- platform: mqtt
name: "Outside Temp"
state_topic: "5n1"
unit_of_measure: "°F"
value_template: >
{% if value_json.message_type == 56 %}
{{ float( value_json.temperature_F) }}
{% else %}
{{ states('sensor.outside_temp') }}
{% endif %}
- platform: mqtt
name: "Outside Humidity"
state_topic: "5n1"
unit_of_measure: "%"
value_template: >
{% if value_json.message_type == 56 %}
{{ float( value_json.humidity|round(1)) }}
{% else %}
{{ states('sensor.outside_humidity') }}
{% endif %}
It’s unit_of_measurement not unit_of_measure
That would do it. I had others correct. Thanks
hello it is possible not to display numeric data but only I name and progress bar? thank you
hey there,
I really like the gauge card. Great work but I’ve got one problem with it. It always shows blue color.
Defined the card like this:
- type: custom:gauge-card
title: Download
entity: sensor.speedtest_download
max: 51
severity:
- green: 45
- red: 0
- amber: 30
The value of the sensor is 47.6 Mbit/s. The bar is shown in blue not in green as expected.
I’m using Chrome browser and added the javascript_version: latest to my configuration.yaml
Do you have any idea? Thanks in advance.
1 Like
@gojonny Not at the moment, you can raise an issue for this enhancement here: https://github.com/ciotlosm/custom-lovelace/issues
@sti0 Please use:
- type: custom:gauge-card
title: Download
entity: sensor.speedtest_download
max: 51
severity:
green: 45
red: 0
amber: 30