Dashboard card Y-Axis Origin of 0

I’ve tried standard graph history cards, custom plotly cards, apexcharts – all trying to find any way to create a history graph card with a Y-axis origin of 0 and I can’t get it to work. All Y-axes want to self detemine. Anyone get something like this to work?

Standard history-graph & statistics-graph cards sets a lower bound for Y-axis dependently on displayed data.
For them workarounds are needed (like this one).

Custom cards may have an option to set a lower bound manually.
For instance, mini-graph-card have a “lower_bound” option, check docs.

How to set a 0 lower bound for Y-axis in history-graph:

Assume we have two “humidity” values:

  - type: history-graph
    entities:
      - sensor.home_openweathermap_humidity
      - sensor.home_gismeteo_humidity
    hours_to_show: 2

изображение

Create a zero sensor with same UoM:

template:
  - sensor:
      - name:zero_value_humidity
        unit_of_measurement: "%"
        state: 0

Add this sensor on the graph:

  - type: history-graph
    entities:
      - sensor.home_openweathermap_humidity
      - sensor.home_gismeteo_humidity
      - sensor.zero_value_humidity
    hours_to_show: 2

изображение

Now hide a legend for this zero sensor & make it’s line transparent:

  - type: history-graph
    entities:
      - sensor.home_openweathermap_humidity
      - sensor.home_gismeteo_humidity
      - sensor.zero_value_humidity
    hours_to_show: 2
    card_mod:
      style:
        state-history-charts $ state-history-chart-line $ ha-chart-base $: |
          .chartLegend li:nth-child(n+3) {
            display: none;
          }
        .: |
          ha-card {
            --graph-color-3: transparent;
          }

изображение

If only one humidity graph is displayed, the whole legend may be hidden:

  - type: history-graph
    entities:
      - sensor.home_openweathermap_humidity
      - sensor.zero_value_humidity
    hours_to_show: 2
    card_mod:
      style:
        state-history-charts $ state-history-chart-line $ ha-chart-base $: |
          .chartLegend {
            display: none;
          }
        .: |
          ha-card {
            --graph-color-2: transparent;
          }

изображение


Well, this way may have a glitch - a hidden line may be selected:
изображение

Just avoid selecting it in that way.


Warning: this mod is not needed since 2024.2 (PR)


Similar for statistics-graph

1 Like