Lovelace: mini graph card

Using templates-supporting cards like config-template-card etc.
Also, you may use card-mod (supporting jinja) for hiding all entity-related elements like a graph, state, legend.

1 Like

is there a way to set color_thresholds per entity and not for whole card?

No. There is a related FR on Github.

Hi, is it possible to show extrema for the entity in the y-axis: secondary?

I couldn’t find anything about it in the documentation, but was wondering if there was some “hack”.

Not supported.

For some reason my graph is not grapphing data that I can see is there:
I want to see two weeks worth of data but as you can see it flatlines any data that is older than 11 days in my case.

The code I am using:

type: custom:mini-graph-card
name: Inverter Temperatuur
show_state: true
state_adaptive_color: true
entities:
  - sensor.solis_temperature
line_width: 1
font_size: 90
hours_to_show: 336
points_per_hour: 1
decimals: 0
color_thresholds:
  - value: 35
    color: green
  - value: 50
    color: red
show:
  extrema: true
  name_adaptive_color: true
  state_adaptive_color: true

Last, is it possible to add a Y-axis to this graph similar to the way that you do it in Apex charts that looks like this:

Can you see it not-flatlined with a standard history-graph?

Yes here is the standard history graph with one month of data depicted

No, this is not a history graph card. This is a History view augmented by LTS.
You probably have not more than 10 days in your DB.

Hi, how did you manage to achieve such color play? Your graphics look gorgeous, could you please share how you accomplished this?

Hi, i couldn´t find any solution i have a mini graph card with some color_thresholds but the graph goes black:

Any idea how to fix this?

Card
type: custom:mini-graph-card
name: Temperatur
entities:
  - entity: sensor.kinderzimmer_raumthermostat_temperature
points_per_hour: 3
hours_to_show: 12
hour24: true
more_info: false
animate: true
line_width: 2
decimals: 1
show:
  name: false
  icon: false
  legend: false
  extrema: true
  icon_adaptive_color: true
  fill: fade
color_thresholds:
  - value: 40
    color: purple
  - value: 30
    color: red
  - value: 20
    color: orange
  - value: 10
    color: yellow
  - value: 0
    color: green
  - value: -10
    color: blue

The answer is on this topic: set a min and max for the y-axis.

Although I remember about this “fix”, it is a bit strange; I managed to reproduce “black graph” while investigating issues on GitHub, but have never got it in “real life”; will try to test this case ones again in a week.

thank you but why it is working with hex color thresholds without the min/max of the y-axis?

    color_thresholds:
      - value: 40
        color: "#FF0EF0"
      - value: 30
        color: "#FF0010"
      - value: 20
        color: "#FF5a00"
      - value: 10
        color: "#FFe600"
      - value: 0
        color: "#00ff10"
      - value: -10
        color: "#0094ff"

Are you using the latest version? (which is “dev”)

I honestly have no idea. I only use hex colours and have had this issue with that.

One of recent dev releases has some fixes in part of processing colors (earlier some colors were processed in a wrong way).
Unfortunately, was not able to test it properly due to lack of time.

1 Like

i installed the latest dev and the thresholds with “wording” colors is working but not with variables like below. This came black again.

color_thresholds:
  - value: 40
    color: var(--purple-color)
  - value: 30
    color: var(--red-color)
  - value: 20
    color: var(--orange-color)
  - value: 10
    color: var(--yellow-color)
  - value: 0
    color: var(--green-color)
  - value: -10
    color: var(--blue-color)

Good remark. Will look into it.

Hi
Previously the
group: true
option removed all gaps in stacks. (using standard horizontal stack here). But now there is a small gap.
Any way to remove it completely?
image

1 Like