[Under New Management] Interactive history explorer custom card

[Mariusthvdb (Marius)]

on the resize observer: its not on all, so that made me notice. I probably see it in the log now became I stopped filtering the frontend in logger (for debugging purposes on something else…)

  frontend.js.latest: fatal

Still, harmless as it might be, it’s ugly, and I am aware the dev team did a lot on the subject, so I figured they would have been all gone… not so apparently.

The SQL: I am not using it, it was used to transfer a MariaDB to the system default SQL, I can safely uninstall probably, even better.

Yet Ive never seen the warning, so will report somewhere in the add-on discord/community

[HeyImAlex (Alex)]

V1.0.50 is up !

Besides fixing a bug with the new multi-year cache and the more-info popup override, you can now also configure how your time ticks look like.

By default, time tick density is automatic and adjusts to the width of your screen. That’s always a compromise between looking good (no clipping), being readable at all screensizes from mobile to wall sized 8k TV and subjective preferences over tick densities. The latter one was always a bit complicated. Also because I personally prefer sparse ticks with low density, but it seems that a lot of people prefer much higher densities.

There has long been the undocumented timeTickDensity setting. Undocumented because it would not really do what most people would expect it to do. It would unlock higher densities on high resolution displays only, or allow you to lower density on all displays. It would however not allow the general increase of density.

So with 1.0.50 I introduced a new config block. For those of you who were already using timeTickDensity, this setting will continue to work as-is (no breaking changes with this card !). It is however overridden by the new settings, if you decide to use both.

timeTicks:
  # optional, this is the same as the old timeTickDensity. It limits the density for the auto-density selection
  density: 'high' 

  # optional, if present, this will skip the auto-density and force the use of your selected density. Possible options are: low, medium, high, higher, highest.
  densityOverride: 'highest'

  # optional, this can be used to shorten the date representation on the time ticks, to make more space if you want high tick densities. Possible values are normal and short. Default is normal.
  dateFormat: 'short'

Examples for a 2 week range on a small card:

Not using the new settings, everything at the defaults:

Using densityOverride at higher, leaving the date format at normal:

And same as above but settings the dateFormat to short:

Keep in mind that overriding the density will disable automatic density calculations depending on card or screen width. So you can easily end up in situations where the labels will overlap.

[sloofood]

Hi Mirek, would like to know how you did this. Could you please share your yaml configuration?

[mirekmal (Mirek Malinowski)]

Here it is (current version, might sligtly differ from screenshot, I reversed upload and diwnload directions):

type: custom:history-explorer-card
decimation: false
showUnavailable: false
uimode: dark
uiColors:
  gridlines: '#444856'
  labels: '#A4A7B4'
  buttons: '#2C2E3C'
  selector: '#2C2E3C'
  closeButton: '#0000001f'
labelAreaWidth: 90
uiLayout:
  selector: hide
  toolbar: show
header: hide
graphs:
  - type: line
    entities:
      - entity: sensor.speedtest_download
        name: Download
        color: '#F03A3E'
        fill: '#F03A3E22'
        unit: Transfer Speed (mbps)
        scale: 0.1
      - entity: sensor.speedtest_upload
        name: Upload
        color: '#003C9E'
        fill: '#003C9E22'
        scale: -1

[sloofood]

Tanks for response in Lightspeed:

i’ve tried this:

    cards:
      - type: custom:history-explorer-card
        cardName: historycard-11116919
        recordedEntitiesOnly: true
        defaultTimeRange: 4d
        defaultTimeOffset: 1h
        refresh:
          interval: 30
        combineSameUnits: true
        graphs:
          - type: curves
            entities:
              - entity: sensor.fb_dave_6591_download_geschwindigkeit
                scale: 0.05
              - entity: sensor.fb_dave_6591_download_geschwindigkeit_2
                scale: 0.05
              - entity: sensor.fb_dave_6591_upload_geschwindigkeit
                scale: -1
              - entity: sensor.fb_dave_6591_upload_geschwindigkeit_2
                scale: -1

but card is empty - any suggestions?

[HeyImAlex (Alex)]

@sloofood

- type: curves

curves is not a valid graph type. Try type: line as in Mirek’s example above. You can then set the interpolation mode of the line graph to curves if you want (but that’s the default anyway).

[sloofood]

Thanks for response - worked like a charm

[fra (francesco)]

hi at all, could someone help me to modify the “calendar” view on the top left?

i would like to show: 15/09/2023

I tried to change my locale settings but nothing to do… thanks a lot.

[HeyImAlex (Alex)]

The date format will be taken from your active locale. The month will always be named by its short form according to that locale (ie. non-numeric). That’s not configurable.

[fra (francesco)]

OK! Thanks a lot!

[topfer]

Hi, I like the chart card, but have two questions

1. When I delete the states of an entity, my chart does no longer show anything. The statistics (in the db) are still there (only the states are purged to keep db small) and the statistics graph of HA keeps showing the bars:
   
   

square: false
type: grid
cards:
  - type: custom:history-explorer-card
    cardName: historycard-77069541
    labelsVisible: true
    header: Daily
    barGraphHeight: 200
    defaultTimeRange: 1o
    defaultTimeOffset: 1d
    decimation: true
    tooltip:
      showDuration: true
      showLabel: false
    uiLayout:
      invertZoom: true
      selector: hide
      interval: hide
    graphs:
      - type: bar
        options:
          interval: daily
          showTimeLabels: true
        entities:
          - entity: sensor.energy_wattpilot
            name: ''
            color: rgba(0,255,0,0.5)
  - chart_type: bar
    period: day
    type: statistics-graph
    entities:
      - sensor.energy_wattpilot
      - sensor.wattpilot_totally_charged
    stat_types:
      - change
    hide_legend: true
    title: Daily
columns: 1

Do I set anything wrong or why does this happen to my charts?

2. Is it normal, that this chart is slower than the HA statistic graph? Or is there a way just to use the statistics and not the states for the chart?

Thanks for any hints!

[HeyImAlex (Alex)]

@topfer

Do I set anything wrong or why does this happen to my charts?

You deleted your entire history, so an empty graph is not unexpected here…

@topfer

Is it normal, that this chart is slower than the HA statistic graph?

No, that’s not normal. Check if the shown time range is the same. Also, if you’re only interested in long term statistics, make sure to force that source. Otherwise the card will fetch the main history DB, which is usually slower (but a lot more accurate).

@topfer

is there a way just to use the statistics and not the states for the chart?

statistics:
  force: true

[topfer]

Thanks for the answers.

@HeyImAlex

You deleted your entire history, so an empty graph is not unexpected here…

No all, only the short term statistics (states table)

The force did what I needed! Thanks a lot for this.

[MassiPi]

Hello,
very nice integration!!
However, it seems i can’t get this to hide entities that have no statistics. Shouldn’t it be set like this?

views:
  - title: History Explorer
    panel: true
    type: panel
    badges: []
    cards:
      - type: custom:history-explorer-card
        recordedEntitiesOnly: true
        defaultTimeRange: 1w
        combineSameUnits: true
        showUnavailable: false
        cardName: historycard-30691461

Thanks!

[HeyImAlex (Alex)]

@topfer

No all, only the short term statistics (states table)

Yup, that’s your entire history That’s why the graph showing the history was empty.

There is a very clear distinction in Home Assistant between history and long term statistics. This card merges both in realtime and tries to hide the HA implementation details under a combined history. But that doesn’t change the underlying approach. If you delete your states table, then you kill your entire history and only keep the (much less precise) long term statistics.

BTW, brutally killing the entire history DB is probably not the right approach. If it’s about keeping DB size down, you should exclude entities you don’t care about and/or that create lots of states. See here for some ideas.

@MassiPi

However, it seems i can’t get this to hide entities that have no statistics

What do you mean by ‘statistics’ ? See the my reply above to topfer.

[MassiPi]

@HeyImAlex

What do you mean by ‘statistics’ ? See the my reply above to topfer.

Hello,
i’m thinking about this part:

i assumed this would filter out all entities that have no “statistics”, so long term recordings (all my entities have short term recordings - the fixed 10 days), am i wrong? because i still see all my entities and it’s a mess.
I also tried with

force: true

with no results, i still see all my entities.
Probably i misinterpreted the readme
Thanks

[HeyImAlex (Alex)]

@MassiPi

i assumed this would filter out all entities that have no “statistics”, so long term recordings

It will filter out all entities that have no history, the ‘short term recording’ as you put it. It does not filter by long term statistics.

You can manually add filters to the list, eg only energy entities, etc. From the readme:

The entities shown in the list can be further filtered using the filterEntities option. The same wildcard syntax applies here. For example:

type: custom:history-explorer-card
filterEntities: 'binary_sensor.*'   # Show only binary sensors in the selector dropdown list
filterEntities:                     # Or use multiple filters, entities matching any of the filters will be added
  - '*power*'
  - 'sensor.*energy*'

[MassiPi]

@HeyImAlex

It will filter out all entities that have no history, the ‘short term recording’ as you put it. It does not filter by long term statistics.

thanks, much clearer, my fault!
i can’t think to an entity with no history, is it only the case of specific exclusion? (TBH i wouldn’t even know how to exclude some entities from keeping the canonic 10 days history…)

[arganto]

@MassiPi

i can’t think to an entity with no history, is it only the case of specific exclusion? (TBH i wouldn’t even know how to exclude some entities from keeping the canonic 10 days history…)

Recorder

[topfer]

@MassiPi

i can’t think to an entity with no history, is it only the case of specific exclusion? (TBH i wouldn’t even know how to exclude some entities from keeping the canonic 10 days history…)

You can use the recorder settings in the configuration.yaml. Either exclude only long term statistics

# Exclude long term statistics
homeassistant:
  customize_glob:
    "sensor.my_sensor*":
      state_class: none
  customize:
    sensor.my_sensor_2_state:
      state_class: none

Or all statistics:

#Exclude recorder
recorder:
  exclude:
    entity_globs:
      - sensor.time*
      - sensor.date*
    entities:
      - sun.sun

HTH