Great ! Thanks for this. Works great
1 Like
Thanks for the time of explaining this, it is much appreciated and I will check again.
Regarding the data not showing a week I am an idiot (oh really!!!), I did set 0.4 not 0.04… so… yeah… xD
I got now why it was not smooth, make perfectly sense… the question is… how can I check/know how often a sensor update? (as per weather and sun?)
EDIT:
Yes, now I can see a week!
But I am noticing something odd,not sure where this is coming from:
See the first few bars on the left? If I go on them it says 1021.3 while the one on the far right is 1031.8
Is that big jump normal graphically speaking?
Thanks!
Happy to help! I get that it can be a bit confusing with hours_to_show & points_per_hour and how they correlate, but that was the best solution I could come up with for maximum customizability and flexibility.
It’s because I opted to not go for any type of dynamic scaling for the y-axis, since we actually don’t know what type of metrics or values are going to go into the graph, it’s impossible to decide on an appropriate y-scale.
The y-scale is therefore absolute and based on the extrema (max - min = scale).
You can however specify a custom pre-defined y-axis scale with the help of the lower_bound and/or upper_bound (you can actually set just one and let the other auto scale) options.
Not sure if you can from the GUI, you might have to check the documentation for that specific platform or look directly in the database, (you can pull the data from the REST API).
I wold like to graph the maximum data out of a day in a bar graph. Example the energy in kWh produced by solar panels. Is there a way to pick the max of a day instead of the median? or to say to pick the only data per day at a precise interval? Like at 23:59:59 so i know it is the last one
No, this is not possible, the graph is based on the moving average and data point intervals are calculated from the current time.
Is the line_color used also for the graph: bar?
I have line_color: deeppink but cannot get the right color for the bar
This is the code:
- entity: sensor.pressure_158d0001b95f60
name: Pressione
show_state: true
line_color: deeppink
show_indicator: true
state_adaptive_color: true
icon: mdi:gauge
line_width: 2
hours_to_show: 168
points_per_hour: 0.083333333333333
hour24: true
show:
icon: true
points: hover
extrema: true
fill: false
labels: true
graph: bar
align_state: center
animate: true
But this is what i get:
Yes the line_color option applies to the bar graph as well, it was implemented prior to the bar graph feature, hence the name.
It should however go into the base of the card config, and you’ve specified it in the entity. The entity object has a color option though, so simply changing line_color to color should work in your case.
All options are available here.
1 Like
Hi All, is there any reason why this would work in Chrome but doesn’t in Safari or the ios app? I Can’t see what I have done wrong.
There’s some other cards that don’t work in Firefox - awaiting an upgrade with some new feature… maybe the same issue with safari… (which also affects the iOS app). Sorry for being vague - can’t remember exact issue…
Safari on macOS or iOS? It has definitely worked in both Safari and the iOS app before, anyone else having this issue?
I have the same issue. And on a windows pc I tried Firefox and Explorer. Only Chrome works for me. However I only use Chrome so it is not a big problem to me.
kalkih: One feature request: Can you add lines by options? Like the ugly chart which opens in the popup. With some lines in the x and y axis I would better see the value beweeen the extrema.
What issue do you have? The issue in the post I answered was an invalid card configuration.
Don’t think I will ever add this tbh, I want to keep this graph minimalistic, and not overlap the features and functionality of the default history-graph too much.
Even if I understand your point of keeping thing simple, this card is above the standard one with customizations, so even if some feature are part of the default one, the way this one can show informations it’s a completely different level
That said, maybe more funcitonality will have, including the one already present in the default one, it might simply “force” devs to have the default one improved at the level as this one 
or maybe this one could be adopted as the standard one 
So I went in to the module and changed letter-spacing: 0.5em to letter-spacing: normal and it looks much better now. No idea why it ended up looking so odd on mine compared with everyone else though.
Hope this helps anyone else with the same issue.
Thanks guys, happy you like it.
The default graph is however based on a well-known graph library, so it’s certainly more robust and well tested than my custom one. Using a real graph library for a project of this scale is probably the correct way to go.
Also, this graph is completely based on the moving average, so it’s not really suitable for all use cases, this could potentially change in the future though I guess.
Yep, letter spacing is pretty inconsistent unfortunately, it could behave differently depending on browser and/or font, but when it turns out as expected it does look pretty sweet and can make things easier to read imo.
Think this is the same issue as the one reported here, but hard to tell without having access to the historical data.
Basically an issue with how the graph calculates values for data points where there are no historical data available. Got a fix in mind and will release it with the next update, I’ll let you know when It’s available.
1 Like