I just got an Airthings Radon monitor, and the integration with HA went smoothly. As a starting dashboard I have a simple card displaying sensor values.

But I let myself get carried away and got the one with the most sensors. So expected to see history graphs so I can look at trends or events, but it never occurred to me they were all different units and scales. HA wants to create many charts, which is less easy to read.

Does anyone have dashboard ideas on how to display these?

  • 18107@aussie.zoneEnglish
    2·
    20 hours ago

    I’ve found apexcharts-card to be fairly configurable and good looking. I’ve put 2 different data types on the one graph and used two axes (price left, % right). Sometimes the values get “stuck”, but a refresh fixes it.

    Example apexcharts-card using Amber energy price forecast and renewable energy %

    YAML code for my chart 
    type: custom:apexcharts-card
apex_config:
  legend:
    show: false
graph_span: 12h
span:
  start: minute
yaxis:
  - id: price
    min: ~-10
    max: ~40
    decimals: 0
  - id: renewables
    opposite: true
    min: 0
    max: ~100
    decimals: 0
header:
  show: true
  title: Amber Prices
  show_states: true
  colorize_states: true
series:
  - entity: sensor.amber_general_forecast
    name: General Forecast
    unit: c/kWh
    color: "#3498DB"
    yaxis_id: price
    data_generator: >
      const data = [];

      data.push([hass.states['sensor.amber_general_price'].attributes.nem_date.replace(/0{2}$/,
      "30"), hass.states['sensor.amber_general_price'].attributes.per_kwh*100]);

      for(let i = 0; i <= 24; i++) {
        data.push([entity.attributes.forecasts[i].nem_date.replace(/0{2}$/, "30"), entity.attributes.forecasts[i].per_kwh*100])
      }

      return data.reverse();
  - entity: sensor.amber_feed_in_forecast
    name: Feed In Forecast
    unit: c/kWh
    color: "#ff9800"
    yaxis_id: price
    data_generator: >
      const data = [];

      data.push([hass.states['sensor.amber_feed_in_price'].attributes.nem_date.replace(/0{2}$/,
      "30"), hass.states['sensor.amber_feed_in_price'].attributes.per_kwh*100]);

      for(let i = 0; i <= 24; i++) {
        data.push([entity.attributes.forecasts[i].nem_date.replace(/0{2}$/, "30"), entity.attributes.forecasts[i].per_kwh*100])
      }

      return data.reverse();
  - entity: sensor.amber_feed_in_forecast
    name: Renewables
    yaxis_id: renewables
    unit: "%"
    color: "#2ECC71"
    data_generator: >
      const data = [];
    • AA5B@lemmy.worldOPEnglish
      1·
      45 minutes ago

      Thanks but this needs like half a dozen, so I don’t think this type of chart will scale