The history page currently has two types of timelines: a colored bar timeline and an actual graph of values over time. Right now these do not line up vertically so the times do not line up as one would expect. I use this page to find when something happened and then compare what else happened around the same time. This is difficult with the current layout and I would appreciate it if all of the graphs started and ended at the same horizontal position so all of the times lined up vertically.
See below for an example of how the times do not line up. The start of the graphs need to be pushed over to the right so they start at the same spot as the colored bars.
I posted a similar request on github discussions - maybe that was not the best place, copying my content from there here as well.
I’ve been using the history graph to compare different actions with each other and one thing that is bothering is the x-axis alignments.
There are several reasons for the x-axis of the different graphs of the same “history-graph” instance to not be aligned:
The labels for the individual series have different widths leaving more or less room for the graph, impacting the width of each individual graph;
The data available is not covering the requested time span - the time span is then adjusted to the available data.
Further, I tried ordering the series, but the binary sensors always appear at the top, and series using the same unit are always grouped together, even when there are one or more series with a different unit in between them.
For instance, I want to separate the dew points from the real tempatures to make it easier to read the graphs, or seperate the % of battery levels from the humidity percentage or percentage of opening.
I realize that it is possible to create multiple history graphs to compensate that, but then they have to be put in a vertical layout to benefit from comparing the events on the time axis by scrolling the view.
Anyway, here is an example where the time axis of the binary sensor is clearly smaller than the other ones so that 10:30 on the first graph is not aligned with the other ones.
I think that a good way to solve this is to add options to:
Allow adjusting the time range to the data or to keep it fixed otherwise;
Strictly respect the order of the series and not group series if they are not adjacent in the list, and allow grouping irrespectively of the order as it is done now;
Have the same (or fixed % width) for the labels/y-axis column, or let it adjust with each individual graph.
I searched the frontend open issues and found one that matches what we’re experiencing. Hopefully it is being worked on and gets the right attention being classified as a bug. Feel free to chime in there as well.
Edit: This may just be for the history-graph card.
