Thanks… was doing it wrong.
entities:
- entity: sensor.0x00158d00023cf637_temperature
name: Exterior
line_color: red
line_width: 8
instead of:
entities:
- entity: sensor.0x00158d00023cf637_temperature
name: Exterior
color: red
line_width: 8
How to add the friendly name of the sensors when having show_state: true and multiple sensors on the same card like this:
There is no way, at the moment at least, to have each sensor name next to the value.
One request that has already been done is to have the value of the same color of the bar/legend to easily idenetify, having the name there might become too confusing, it might be worth to have an additional card with the entities and the values, at least for no 
Really nice!!!
Can you share the code?
Thanks
Sure, here it is… Before i was using card-modder, but now i am switching my themes with the two new variables.
- type: horizontal-stack
cards:
- type: custom:mini-graph-card
name: Balcone
entities:
- sensor.temperature_158d0001b95f60
hour24: true
show:
graph: false
icon: true
extrema: true
fill: false
align_state: left
- type: custom:mini-graph-card
name: Camera Letto
entities:
- sensor.temperature_158d0001b95fa0
hour24: true
show:
graph: false
icon: true
extrema: true
fill: false
align_state: center
- type: custom:mini-graph-card
name: Salotto
entities:
- sensor.temperature_158d0002009a82
hour24: true
show:
graph: false
icon: true
extrema: true
fill: false
align_state: center
- type: horizontal-stack
cards:
- type: custom:mini-graph-card
name: Studio
entities:
- sensor.temperature_158d000238a357
hour24: true
show:
graph: false
icon: true
extrema: true
fill: false
align_state: center
- type: custom:mini-graph-card
name: Cameretta
entities:
- sensor.temperature_158d0002739d0a
hour24: true
show:
graph: false
icon: true
extrema: true
fill: false
align_state: center
- type: custom:mini-graph-card
name: Bagno
entities:
- sensor.bagno_temperature
hour24: true
show:
graph: false
icon: true
extrema: true
fill: false
align_state: center
- type: custom:card-modder
card:
type: custom:mini-graph-card
name: Temperature 48h
entities:
- entity: sensor.temperature_158d0001b95f60
name: Balcone
- entity: sensor.temperature_158d0001b95fa0
name: Camera Letto
- entity: sensor.temperature_158d0002009a82
name: Salotto
- entity: sensor.temperature_158d000238a357
name: Studio
- entity: sensor.temperature_158d0002739d0a
name: Cameretta
- entity: sensor.bagno_temperature
name: Bagno
line_width: 2
height: 150
hours_to_show: 48
points_per_hour: 0.50
hour24: true
show:
icon: true
points: hover
fill: false
align_state: center
animate: true
style:
background-size: 100% 400px
--primary-text-color: var(--primary-text-color)
--secondary-text-color: var(--secondary-text-color)
--paper-item-icon-color: var(--primary-text-color) #small variation icons
background-repeat: no-repeat
border-radius: 20px
border: solid 1px rgba(100,100,100,0.3)
box-shadow: 3px 3px rgba(0,0,0,0.4)`Preformatted text`Not exactly as intended, in fact what you did is actually much better than what I intended!!
Oh, yes now understand what you mean… but i think it’s better in this way…
I’d like also to change the text size but still don’t know how to use it in the mini-graph-card
Your way looks much better that what I suggested 
You have the font_size option to change the font size of the state, next version there’ll be an additional font_size_header option to adjust the font size of the header (name & icon).
After setting up my utility meter (power consumption - kWh), for day, week, and month, it was time to use the mini-graph-card.
I was hoping to display three mini-graph-cards. One card for daily having 360 bars displaying one bar for each day. One card for weekly having 52 bars displaying one bar for each week. And one for monthly having 12 bars displaying one bar for each month. -The cards may be limited with fewer bars where the last measurement is to the right in the card .
Turns out, when using the sensors with the mini-graph-card, it did not turn out how I expected. No wonder, since the utility meter sensors are topped up continually by the power consumption sensor (sensor.energy_consumption2).
So, I created three new template sensors, sensor.energy_hotwater_daily_end, sensor.energy_hotwater_weekly_end and sensor.energy_hotwater_monthly_end. This sensors gets their value when the utility meter sensors are reset for a new period, and the _end-sensors then get the attributes.last_period from the utility meter sensors. – Which did not work any better when it came to display the graph.
My question is, is it possible to achieve what I am looking for with the mini-graph-card, and if so, how?
Is it at all possible to have a card with a parameter for retrieving X-count of measuring point, and not just time period?
####################################################
# UTILITY METER - ENERGY #
####################################################
energy_hotwater_daily:
source: sensor.energy_consumption2
cycle: daily
energy_hotwater_weekly:
source: sensor.energy_consumption2
cycle: weekly
energy_hotwater_monthly:
source: sensor.energy_consumption2
cycle: monthly
####################################################
# ENERGY HOTWATER DAY/WEEK/MONTH TOTALS #
####################################################
- platform: template
sensors:
energy_hotwater_daily_end:
friendly_name: 'Energy hotwater daily total'
unit_of_measurement: 'kWh'
icon_template: mdi:counter
value_template: '{{ states.sensor.energy_hotwater_daily.attributes.last_period | float }}'
energy_hotwater_weekly_end:
friendly_name: 'Energy hotwater weekly total'
unit_of_measurement: 'kWh'
icon_template: mdi:counter
value_template: '{{ states.sensor.energy_hotwater_weekly.attributes.last_period | float }}'
energy_hotwater_monthly_end:
friendly_name: 'Energy hotwater monthly total'
unit_of_measurement: 'kWh'
icon_template: mdi:counter
value_template: '{{ states.sensor.energy_hotwater_monthly.attributes.last_period | float }}'This has been discussed quite a lot in this thread lately. The graph is based on a moving average and the time intervals are calculated from the time of page refresh, this is not ideal for every use case.
So to answer your question, no this is not really possible to achieve using this card. The bar chart also has a limit of 96 bars, so 360 bars in one card is not possible.
i’m having issue, after restore from a snapshot.
the graph is flat… alt ho its temps,humidity are updating.
tried delete db file, didn’t helped the issue only with your custom mini graph.
if i use the normal history graph the bar is updating.
any ideas?
my config:
- type: horizontal-stack
cards:
- type: custom:mini-graph-card
entities:
- sensor.living_room_temp_temperature
name: Temperature
line_color: var(--accent-color)
line_width: 8
font_size: 75
- type: custom:mini-graph-card
entities:
- sensor.living_room_temp_humidity
name: Humidity
line_color: blue
line_width: 8
font_size: 75
- type: custom:mini-graph-card
entities:
- sensor.illumination_158d0001e50fc6
name: Illumination
line_color: '#e74c3c'
line_width: 8
font_size: 75
it was working great, issue started after i restored from a snapshot… someone has an idea what to do?
Give it some time, with the default options the graph displays one point for every two hours, so might take some time before you see the graph updating.
ok, i will wait an update! thanks man!
I’m getting a line instead of a bar graph, what am I doing wrong?
- type: custom:mini-graph-card
entities:
- sensor.dagelijks_solar
hours_to_show: 168
points_per_hour: 0.041666667
name: Opbrengst laatste 7 dagen
show:
graph: barUpdate your card if you haven’t in a while or clear cache.
Hi. I have installed Hass.io. Before I had it installed without Hass and it worked perfectly. Now I can not tell in this environment because he can not find the card. It is located at www. What can I check to see what the error is? Thank you
Working! I had to wait 2 hours as you said
You need to open the dev-tools in the beowser, go on the network tab and filter by mini-graph
Click on the .js file and it will tell you the path (URL) where it is trying to donwload it to.
it should be something like:
http://192.168.0.1/local/mini-graph-card.js
/local identify your www folder, it can only be /local/ or /customcards/ if you’re using the custom_updater component.
If it’s different than that, you have something wrong in the config.
If it’s local/cards/mini-graph-card.js you need to place the file in www/cards/ inside your config folder.
Hope this helps
Andrea
