Time alignment between multiple entities in history graph

[rzolau]

#5302 The request

Provide additional parameter to set, or enforce by default, alignment of time in History Graph Card. Currently, when two different entities are plotted, that use different units, both plots use different scaling for time axis. As a result, the plots are misaligned (see attached image). This makes visual data analysis challenging, can be misleading and is aesthetically problematic.
In the image below, observe how 3am tic is shifted between the plots (plots have been generated using the following YAML):

                - type: history-graph
                  hours_to_show: 24
                  refresh_interval: 30
                  entities:
                    - entity: sensor.some_temperature
                      name: "Temperature"
                    - entity: binary_sensor.some_binary_state
                      name: "State"

The alternatives

Currently, there is no real alternative. One can play with the 3rd party mini-graph-card but this is sub-optimal as styling of the history graph card and mini-graph-card is visibly different.

Additional information

Potential alternative, which could be more visually interesting (or not), is to overlay categorical plot on top of the numerical plot with added transparency. This way different categorical states become zones over numerical plot (mock card below).

[PatrickGlesner]

+1
I'm also interested by this feature. Thanks.

[nukefrenzy]

I also would like to see this issue resolved, but there doesn't seem to be any traction on it as evidenced by how old this issue is, others like it, and feature requests on the forums.

So I'm trying to share my solution to help everyone else frustrated with this issue. I’ve started using the below card as a permanent replacement for the History Panel and History Graph Card. These features make it a huge improvement:

• Easily recreate the existing History Panel with timelines and graphs. Colors can be transferred over so it looks identical and it can be added to the sidebar to mimic existing panel
• Duration selector at the top to quickly pick timeframes to view
• Graphs can be panned by dragging the mouse to show more data (all graphs move together)
• All dates/times line up vertically, which is a major nuisance with the existing History Panel
• Entities can be setup manually in YAML so a default, defined view is always immediately ready (similar to the old History Panel)
• Entities can be added on the fly using the entity picker drop down (this can be pre-filtered to only those entities that are actually recorded in your database with recordedEntitiesOnly: true)

New interactive history explorer custom card
https://github.com/alexarch21/history-explorer-card

I put a couple screenshots of my setup here: https://community.home-assistant.io/t/request-common-or-aligned-time-axis-on-all-history-graphs/246613/4?u=hassbrad

[rzolau]

History-explorer-card is definitely huge improvement [the author definitely deserves a coffee or two ;-)]. Did anyone try how it works as a one-to-one replacement for history-graph (I will not be able to do any testing myself for few months)? I mean, any performance overheads, or changes one has to make to the existing views?

[karwosts]

Pull request #14919 attempts to address this issue.

[rzolau]

Thank you for awesome work. Does this change affect also "History Graph Card"?

[karwosts]

Yes

[karwosts]

This has been implemented for some time now.