Lovelace: mini graph card

Unless I missunderstood something, you can use the y_axis to show bar (s?) and the main axes for lines (or presumably vice-versa).

That’s what I use for the temperature isnide/outside night/day graph:
image

I hope I didn’t missunderstand the question :smiley:

3 Likes

That’s clever :smile::+1:

Well that’s not actually a bar chart. That’s a boolean sensor. A bar could have different heights, not just on/off.

There’s only one global setting for showing as a bar chart and it affects both axis (I tried).

Yup, I do the same but it’s a line chart, not a bar chart. The boolean on/off makes the sides look quite straight.

and @kalkih, I got the idea from one of the examples on your github page :smile:

image

The tricky bit for me was to get all of the graphs on the page to use the same max and min for the y axis (for easy comparison) without using such a large range across summer and winter that the temperature line just appeared flat.

I ended up creating history sensors for each temperature reading, using a template sensor to pick out the max and min values with config-template-card to set the values for each graph. Life would be easier if I could learn to live with what I’ve got rather than try to make everything to give me what I want. :woozy_face:

1 Like

Oh… right… it does only look like it :smiley:
I never actually thought about that as a “line” ahahahahah

Good point :slight_smile:

Let me rephrase, can you make it so I can have a bar and line on the same graph. :call_me_hand:

Yes, It’s definitely doable but I don’t really have the time nor the desire to develop this project atm.

1 Like

Does anyone know of a way to use this card as a thermostat history-graph card to be able to show when heating or cooling is on the same way others have done with day/night lines?

The native history-graph in home assistant does this but mini-graph is so much prettier! :wink:

1 Like

I’ve done this myself, there is an example somewhere up the thread that i stole from, but here is my code anyway. You need to create template sensors first like the below:

  - platform: template
    sensors:
      main_ac_heat:
        friendly_name: "Main AC Heat"
        value_template: >-
            {% if states.climate.air_conditioner.state == 'heat' %}
              1
            {% elif states.climate.air_conditioner.state == 'Heat' %}
              1
            {% else %}
              0
            {% endif %}
      main_ac_cool:
        friendly_name: "Main AC Cool"
        value_template: >-
            {% if states.climate.air_conditioner.state == 'Cool' %}
              1
            {% elif states.climate.air_conditioner.state == 'cool' %}
              1
            {% else %}
              0
            {% endif %}

then create a graph card like the below:

      - type: 'custom:mini-graph-card'
        style: |
            ha-card {
              border-radius: 12px;
              box-shadow: none;
              background-image: none;
              background-color: transparent;
              color: var(--primary-text-color)
              font-weight: bold;
            }
        entities:
          - entity: sensor.temperature_158d000221a557
            name: Main Bedroom
            color: var(--tertiary-line-color)
            show_fill: false
            smoothing: true
          - entity: sensor.temperature_158d000221a5c4
            name: Girls Room
            color: var(--secondary-line-color)
            show_fill: false
            smoothing: true
          - entity: sensor.temperature_158d0003a2ce91
            name: Sebs Room
            color: var(--primary-line-color)
            show_fill: false
            smoothing: true
          - entity: sensor.main_ac_heat
            color: #fc7c6e
            name: Heat
            show_legend: false
            show_line: false
            show_points: false
            y_axis: secondary
          - entity: sensor.main_ac_cool
            color: #349CF6
            name: Cool
            show_legend: false
            show_line: false
            show_points: false
            y_axis: secondary
        hour24: true
        animate: true
        font_size_header: 9
        group: true
        hours_to_show: 8
        smoothing: true
        line_width: 3
        points_per_hour: 12
        show:
          extrema: false
          fill: fade
          icon: false
          labels: hover
          labels_secondary: hover
          name: false
          state: false
        state_map:
          - label: 'Off'
            value: '0'
          - label: 'On'
            value: '1'

Results in a graph like the below, showing when it heat or cool mode (seems like color not producing correctly for the fill graph though):

Capture

4 Likes

Thank you a lot! This is just what I was looking for right now!

Awesome!! Thank you!

I get the following error:


Does anyone know the solution.

Thanks!!

      - type: custom:mini-graph-card
        entities:
          - entity: sensor.your_sensor_name
1 Like

I reckon this is a long shot but…

Is there any chance you would consider allowing the entity to be templated?
I now have two totally independent reasons to want to do this.

I have two situations where my setup allows for different sensors to be used depending on circumstances. I like to have those sensors graphed but only the one that is currently being used.

For example I have two different light level sensors, one is a crude measure that is used only when the more accurate but less reliable one is unavailable.

I’d like to have only one graph which is based on the active sensor. This could be achieved if the entity was templatable.

Thanks for considering it.

image

1 Like

Hi Benm7,

I’m trying to do the same as you, is the first time using templates and I don’t know what I’m doing wrong. I validated that the code works in the template manager, it changes if I turn on the AC. Now I’m trying to put the code in configuration.yalm, under sensors, just next to the ones that I have defined, and it compiles. The code is like this:

sensor:

  - platform: yr
    name: Temperatura calle
    monitored_conditions:
      - temperature
      
  - platform: systemmonitor
    resources:
      - type: disk_use_percent
        arg: /home
      - type: disk_use
        arg: /home
      - type: disk_free
        arg: /home
      - type: memory_free
      - type: memory_use_percent
      - type: memory_use
      
  - platform: template
    sensors:
      Aire_Calor:
        friendly_name: "Aire acondicionado calor"
        value_template: >-
          {% if states.climate.aire_salon.state == 'heat' %}
            1
          {% else %}
            0
          {% endif %}
      Aire_Frio:
        friendly_name: "Aire acondicionado frio"
        value_template: >-
          {% if states.climate.aire_salon.state == 'cool' %}
            1
          {% else %}
            0
          {% endif %}

It compiles and the problem is that when I reboot the system tells me this:

Invalid config
The following integrations and platforms could not be set up:

type
sensor.template
Please check your config.

Any idea? I want to learn how to template.

Thank you in advance.

the only thing I can think of is that you are using capitals in the sensor names, which I don’t think is allowed. Make them all lower case and see what happens…

Folks - I’ve got this weird issue where values on the dashboard are showing up as NaN. The setup involves an ESP32 loaded with ESPHome capturing data from a DHT11, soil moisture sensor and sending data every hour. The ESP32 is powered off an 18650 battery so sleeps for 60mins and then runs for 1 min.

I can see non zero values being captured but for some reason the dashboard seems to display NaN even if there was a NaN captured a while ago i.e. not recent value.

The card configuration is very simple -

entities:
  - sensor.higrow001_soil_moisture_2
font_size: 75
hours_to_show: 72
icon: 'mdi:water-percent'
line_color: white
line_width: 8
name: HG001 SoilMoisture
type: 'custom:mini-graph-card' 

Am i supposed to add some additional config to make it display the latest value correctly? Not sure what i am doing wrong… :frowning:

not sure if it would go in this specific card, but you could create a backend template sensor, selecting the correct sensor depending on your described conditions? I have several places in the config, where the actual card doesnt allow for a template, but it can use a template sensor doing the work for me :wink: Never tried it with a sensor itself, always with attributes, but hey, maybe this would work?

light_sensor_select:
  value_template: >
    sensor.{{'less_reliable' if states('sensor.less_reliable') != 'unavailable' else 'crude'}}

...

Actually I just realised I can use config-template-card for this.

I’m not sure I agree that templating the entity doesn’t belong in this card. Why not? template everything I say!! :wink:

But it’s a question for Romrider.

Either way, I’m ok with it, it’s just nice to use less cards!

In response to the “NaN” issues above I’ve opened an issue on github as well. Open to suggestions, input from anyone.

Cheers,
Trevor