The Graph Widget for influxdb is really good. A little difficult to set up (especially newcomers to HA and AppDaemon like me who don’t know the directory structure for CSS and custom widget files etc…) but well worth the effort. See attached picture…it looks great! A big advantage of this approach is the graphs are superconfigurable…The developer has done a great job creating many configurations you can change in the dashboard yaml file. The javascript is fairly easy to follow too if you need to fine tune things (like I changed the select first(value) to an average to get an hourly average instead of the first temperature for the hour). Great job Tomas!
Old picture from when I was testing it out, but I ended up using a iframe of a static camera image from HA to just display a graph from influx, but might give this a try for something a bit more native, and looks to be a lot more customizable.
Had a bit of spare time this morning, so had a play around @tjntomas
I do like the layout of it, it seems a lot easier to read than the camera component one I have setup, but I do like the ability to be able to see what the current temp is for each sensor from the graph as well, not sure if that is something you might be able to implent. @gadjetnut has seem to added in a second widget for the actual temps. But I dont really have too much space left on my dashboard with a major reorganise.
I added the option to display the value next to the legend text. I also added som translation options since I noticed that some text were in Swedish.
The new option in the widget definition:
value_in_legend: 1 # If present, the value will be displayed next to the legend text.
And in the skin:
graph_degrees_celsius_text: "Degrees Celsius" # Adjust to your own language
graph_degrees_fahrenheit_text: "Degrees Fahrenheit" # Adjust to your own language
graph_percent_text: "Percent" # Adjust to your own language
I have almost finally finished moving my homeassistant/appdaemon/influx etc from my Pi/NAS to my new dual xeon server, so once thats all done, I’ll have another play around with it sir.
Although I have to say, moving HA/AD away from the Pi to the server has made a world of difference to loading speed of dashboards, like 5-6 times as fast at least.
After spending 2 or 3 weeks unsuccessfully trying to get the plotly version running I switched to the influxdb solution and almost got it running in a very short time. Unfortunately I get an empty graph that alway shows 10.25 (it is now 14:52). I tried various time values from 1h up to 2w but it’s always gives the same result. The console shows that all available values are returned from the select query and the y-range is correct.
I changed the default time_zone & locale settings to Europe/Zurich & ‘de’ in basegraph.js to get that result. With the original Stockholm & sv I had a range of times on x but only covering a few hundred microseconds:
I can drag the x.axis left and right but I never see any y-values plotted
Here is my dashboard definition:
mvp:
widget_type: graph
entities:
- sensor.temperature_outside # The entity_id to be plotted.
influxdb_units:
- "°C" # The unit_of_measurement for your sensors/entities
titles:
- "Outdoor temperature" # Title of the trace.
time: 24h # Time interval to plot. you can combine w, d, h and m as 2w1d3h20m (This would be 2 weeks, 1 day, 3 hours and 20 minutes)
title: "Temperatures" # Widget title
fill: "tozeroy" # options are "none" | "tozeroy" | "tozerox" | "tonexty" | "tonextx" | "toself"
colorIndex: 0 # A number between 0 and 11. 12 colors for the traces are predefined and the colorIndex defines
log: 1
layout:
- mvp(8x2)
I have the widget setup in a copy of the default skin.
I also added an additional log output “Logger(self, traces)” just before the Plotly.plot call @line 251 and this seems to confirm the single value (the temperature at 10:25:27 was indeed 3.2°C)
Unless you have only posted part of the log output, It looks like you only have one data sample in the influx database so there is nothing to make a plot from. You need at least two samples to draw a trace. To confirm this, you can add dummy values for X and Y by replacing the lines 245 and 246 with:
If this does not produce a line in the graph, there might be a bug somewhere and I’ll will have a look at it.
Your also welcome to open an issue on github if you run into other problems.
I have 50 records in the DB and I see them in the console output, also if I call the select URL directly.
I posted all of the output. I assume Plotly.plot is only called once for all records. I noticed that Plotly.plot doesn’t return - if I add the Logger output after the call it never writes anything. Is that correct?
Ok, if “traces” only contains one sample, there is an error somewhere in the InfluxDB_Data function that we need to find.
The data is read from influxdb in the InfluxDB_Data function and then calls Multiplot with an array of samples as a parameter named “DataSeries” and it seems from your log that the DataSeries variable does not contain all the samples. Please add
console.log(DataSeries, measurement)
as the first line in the MultiPlot function and see what you get in the log.
The Plotly.plot function call does not return a promise and this is the reason for the try/catch part to keep the log clean. If I use the Plotly.plot “outside” a widget, the call returns nicely though and I haven’t managed to figure out why it doesn’t return a promise when used in a widget.
