Regarding the color_thresholds… I still have the same problem.
Not sure what but today it is working fine thanks…
I haven’t read thru the whole thread but is it possible to add a scale to the left side (y-axis)?
I saw the “labels:” option but I’m using 4 entities and it gets kind of crowded on the left hand side of the chart. And I’m kind of not exactly sure what those labels represent.
are those numbers the max and min of the entire chart? or the max & min of the beginning values of the entities in the chart? Or some other third thing?
1 Like
That is a nice one! Would use such for my sleeping room. Can you please share the code of that one with me?
No, there’s no such feature in the card atm.
Yes, those are the max/min of the y-axis, should probably clarify this in the documentation, thanks.
Hi @kalkih, long time I haven’t been active, and now I am back to give my 2 cents as soon as I find them under the sofa 
Yesterday I was thinking about something that might be a good feature.
The ability to set per-graph a min and max value that the card will use to generate the graph.
Example:
I know that the green bar is approximately 95%, while the blue one, as per text is 69.6%, but it doesn’t “look like it”.
If I was able to add min: 0 max: 100 the graph would generate those bars based on the scale between a min and a max, same would apply for temp if for instance I would set min: -5 max: 45
Would that make sense?
Would that be possible?
Cheers
Andrea
2 Likes
Hey Andrea,
Nice to hear from you again
Nice card setups you got there!
Great idea, certainly useful, it should be possible to achieve already, try the lower_bound and/or upper_bound options and let me know if that does the trick 
.
1 Like
That’s it! Perfect!
Of course maybe 45° as max temp is quite unlikely (for where I live of course), but it is definetely more “realistic”
1 Like
Bonus idea
How about been able to stack the bars on each other instead of next to each other?
This would help in the following example (multiple humidity sensors to have an overview across the house)
Would that be possible?
Of course I can switch it to lines but it doesn’t look “as good” in this scenario
1 Like
Would be cool, but I think it could be hard to implement, discussed briefly here, since I’m not using any graph library, I would have to build it from the ground up.
If possible, can you share your config please?
Sure thing!
This is the Sensor that generate an average for house temperature based on all sensors:
platform: min_max
name: House Temperature
type: mean
entity_ids:
- sensor.living_room_temperature
- sensor.kitchen_temperature
- sensor.studio_andrea_temperature
- sensor.bathroom_temperature
- sensor.master_bedroom_temperature
- sensor.master_bathroom_temperature
This is the Sensor that eenerate an average for house humidity sensors:
platform: min_max
name: House Humidity
type: mean
entity_ids:
- sensor.living_room_humidity
- sensor.kitchen_humidity
- sensor.studio_andrea_humidity
- sensor.bathroom_humidity
- sensor.master_bedroom_humidity
- sensor.master_bathroom_humidity
And this is the card to show them:
- type: horizontal-stack
cards:
- type: custom:config-template-card
entities:
- sensor.house_temperature
variables:
- states['sensor.house_temperature'].state
card:
type: custom:mini-graph-card
name: Temperature
icon: "${vars[0] > 30 ? 'fas:thermometer-full' : vars[0] > 25 ? 'fas:thermometer-three-quarters' : vars[0] > 20 ? 'fas:thermometer-half' : vars[0] > 10 ? 'fas:thermometer-quarter' : 'fas:thermometer-empty' }"
more_info: false
height: 150
line_width: 4
hours_to_show: 168
points_per_hour: 0.25
group: false
hour24: true
animate: true
decimals: 1
font_size: 100
font_size_header: 14
align_header: default
align_icon: right
align_state: center
lower_bound: -5
upper_bound: 40
show:
name: true
icon: true
state: true
graph: line
fill: true
points: false
legend: true
extrema: false
labels: false
name_adaptive_color: true
icon_adaptive_color: true
color_thresholds:
- value: 5
color: "#0055FF"
- value: 15
color: "#FF6600"
- value: 20
color: "#FFAA00"
- value: 22.5
color: "#FF7700"
- value: 25
color: "#FF3700"
entities:
- entity: sensor.house_temperature
name: House
color: '#FF5000'
show_state: true
- entity: sensor.dark_sky_temperature
name: Outside
color: '#0099CC'
show_state: true
- type: custom:mini-graph-card
name: Humidity
icon: fas:tint
more_info: false
height: 150
line_width: 4
hours_to_show: 168
points_per_hour: 0.25
group: false
hour24: true
animate: true
decimals: 1
font_size: 100
font_size_header: 14
align_header: default
align_icon: right
align_state: center
lower_bound: 0
upper_bound: 100
show:
name: true
icon: true
state: true
graph: bar
fill: true
points: false
legend: true
extrema: false
labels: false
name_adaptive_color: true
icon_adaptive_color: true
entities:
- entity: sensor.house_humidity
name: House
color: '#00BFFF'
show_state: true
- entity: sensor.dark_sky_humidity
name: Outside
color: '#59B300'
show_state: true
And this is the outcome:
Please note, to generate the icon it uses Font Awesome icons and the custom-template-card so that it uses a different icon (more or less “full”) depending on the temperature value
It is not the same for the Humidity because there are not different icons for that
Hope it helps
10 Likes
Brilliant. Thanks. Appreciate it.
Hey, one question. How to get to plot an attribute? I would like to graph the actual temperature of a climate entity. It is an AC so the main state is “dry” (dehumidifier) but the attribute “current_temperature” is 27. I tried
entities:
- climate.salotto.current_temperature
but it’s not working
1 Like
Only sensor entities are supported.
You could create a template sensor of the attribute & then use that sensor in the card.
1 Like
Hi @kalkih,
The filling on graph with threshold is always gonna be “one color” or is there a way to have it to change based on the specific threashold the “line” is part of?
Thanks
Will probably make it gradient in the future, will most likely keep it optional though (fill: gradient or similar).
https://github.com/kalkih/mini-graph-card/issues/112
Cool
Thanks
I also noticed that sometimes the graph is loaded in gray (or black), I think I managed to have it twice, once when not using quotes for the color (always in threshold) and once when I used integer number when values were not (ex. temp 10 while the sensor report 10.5).
If the second one is confirmed, it might be worth to add “.0” automatically when the sensor report a “.”?
Would that be possible?
Again, thanks
That can happen if the color isn’t parsed correctly, In order to interpolate the right color for the graphs upper & lower bound when thresholds are outside of the y-axis I had to add some extra calculations, these calculations expects the colors to be in 6 digit hex format. Listed as a breaking change in the latest release
So make sure you are specifying the threshold colors in 6 digit hex format (#XXXXXX), quotes shouldn’t be a problem (I actually think you’ll need them since # is parsed as a comment in yaml) as they are omitted and the content between them is parsed as a string.
Side note, all color formats can still be used when using color thresholds with a bar graph or when the thresholds never intercept the line graphs lower/upper bounds.
Are you able to reproduce this issue? or could you send me the config used so that I could look into it?
Many thanks! 
I have tested it and probably I was simply confused by the time I was testing this 
The “#” is more likely the problem, without quotes it is probably interpreted as comment, therefore the color is basically “null”, which explain the problem
Thanks for your time on clarifying this and sorry for the pointless bug report
Andrea
1 Like