Is there anyway to show the event time on the horizontal axis?
No, but planning on adding that soon.
2 Likes
I actually like the simplify of the graph without axes. Great for a quick glance at a trend.
Where a full featured Graph is required I use Grafana.
Yes, same here and the original design and idea was to keep the graph very minimalistic and light on information. It’s also why I decided to build the graph lib from the ground up.
The feature request has been quite popular though which made me reconsider the idea.
It’ll of course be optional.
2 Likes
Hi all,
I am kinda new to this Home Assistant thing, but I really enjoy configuring it until I ran into this annoying issue I am having.
So I want 1 lovelace card with a sensor in the top, and then 2x2 graphs below it. Something like this:
However, this is what I can get:
This is what I got so far:
entities:
- entity: sensor.bloomhole_seen_clients
icon: 'mdi:devices'
name: Numer of Clients
- align_state: left
entities:
- color: '#19D541'
entity: sensor.bloomhole_dns_queries_today
name: Total Queries
font_size: 75
font_size_header: 22
hour24: true
line_width: 3
points_per_hour: 2
icon: 'mdi:earth'
show:
icon: true
points: false
style: |
ha-card {
border-radius: 12px;
background-image: none;
box-shadow: none;
background-color: rgba(114, 123, 140, 0.1);
font-weight: bold;
}
type: 'custom:mini-graph-card'
- align_state: left
entities:
- color: '#20BEE5'
entity: sensor.bloomhole_ads_blocked_today
name: Ads Blocked
font_size: 75
font_size_header: 22
hour24: true
line_width: 3
points_per_hour: 2
icon: 'mdi:hand-right'
show:
icon: true
points: false
style: |
ha-card {
border-radius: 12px;
background-image: none;
box-shadow: none;
background-color: rgba(114, 123, 140, 0.1);
font-weight: bold;
}
type: 'custom:mini-graph-card'
- align_state: left
entities:
- color: '#EEA527'
entity: sensor.bloomhole_ads_percentage_blocked_today
name: Percent Blocked
font_size: 75
font_size_header: 22
hour24: true
line_width: 3
points_per_hour: 2
icon: 'mdi:chart-pie'
show:
icon: true
points: false
style: |
ha-card {
border-radius: 12px;
background-image: none;
box-shadow: none;
background-color: rgba(114, 123, 140, 0.1);
font-weight: bold;
}
type: 'custom:mini-graph-card'
- align_state: left
entities:
- color: '#DC3F1C'
entity: sensor.bloomhole_domains_blocked
name: Domains on Blocklist
font_size: 75
font_size_header: 22
hour24: true
line_width: 3
points_per_hour: 2
icon: 'mdi:format-list-bulleted'
show:
icon: true
points: false
style: |
ha-card {
border-radius: 12px;
background-image: none;
box-shadow: none;
background-color: rgba(114, 123, 140, 0.1);
font-weight: bold;
}
type: 'custom:mini-graph-card'
show_header_toggle: false
title: PiHole
type: entities
When I try to change this to what I want, it gives an error:
This is what I try:
entities:
- entity: sensor.bloomhole_seen_clients
icon: 'mdi:devices'
name: Numer of Clients
- type: horizontal-stack
cards:
- align_state: left
entities:
- color: '#19D541'
entity: sensor.bloomhole_dns_queries_today
name: Total Queries
font_size: 75
font_size_header: 22
hour24: true
line_width: 3
points_per_hour: 2
icon: 'mdi:earth'
show:
icon: true
points: false
style: |
ha-card {
border-radius: 12px;
background-image: none;
box-shadow: none;
background-color: rgba(114, 123, 140, 0.1);
font-weight: bold;
}
type: 'custom:mini-graph-card'
- align_state: left
entities:
- color: '#20BEE5'
entity: sensor.bloomhole_ads_blocked_today
name: Ads Blocked
font_size: 75
font_size_header: 22
hour24: true
line_width: 3
points_per_hour: 2
icon: 'mdi:hand-right'
show:
icon: true
points: false
style: |
ha-card {
border-radius: 12px;
background-image: none;
box-shadow: none;
background-color: rgba(114, 123, 140, 0.1);
font-weight: bold;
}
type: 'custom:mini-graph-card'
- align_state: left
entities:
- color: '#EEA527'
entity: sensor.bloomhole_ads_percentage_blocked_today
name: Percent Blocked
font_size: 75
font_size_header: 22
hour24: true
line_width: 3
points_per_hour: 2
icon: 'mdi:chart-pie'
show:
icon: true
points: false
style: |
ha-card {
border-radius: 12px;
background-image: none;
box-shadow: none;
background-color: rgba(114, 123, 140, 0.1);
font-weight: bold;
}
type: 'custom:mini-graph-card'
- align_state: left
entities:
- color: '#DC3F1C'
entity: sensor.bloomhole_domains_blocked
name: Domains on Blocklist
font_size: 75
font_size_header: 22
hour24: true
line_width: 3
points_per_hour: 2
icon: 'mdi:format-list-bulleted'
show:
icon: true
points: false
style: |
ha-card {
border-radius: 12px;
background-image: none;
box-shadow: none;
background-color: rgba(114, 123, 140, 0.1);
font-weight: bold;
}
type: 'custom:mini-graph-card'
show_header_toggle: false
title: PiHole
type: entities
Any ideas to get what I want?
This has nothing to do with the mini-graph card and this was the wrong place to post. You need to use a couple of tricks to put a horizontal stack in an entities card. See here: 🔹 hui-element - Use built-in elements in the wrong place
2 Likes
Thanks! That is exactly what I’m looking for.
I am trying to use the mini-graph card with this code.
#
# Atmospheric Quality
#
- type: "custom:vertical-stack-in-card"
cards:
- type: 'custom:mini-graph-card'
align_state: 'right'
decimals: 0
height: 50
hour24: false
unit: 'AQI'
color_thresholds:
- value: 0
color: '#00e400'
- value: 51
color: '#ffff00'
- value: 101
color: '#ff7e00'
- value: 151
color: '#ff0000'
- value: 201
color: '#990049'
- value: 301
color: '#4c0026'
show:
fill: 'fade'
icon: false
labels: true
name: false
points: true
entities:
# - entity: sensor.aqi
- entity: sensor.aqi_particles
color: 'Brown'
- entity: sensor.aqi_ozone
color: 'DeepSkyBlue'
- entity: sensor.aqi_carbon_monoxide
color: 'DarkSlateGray'
This is the view I get
What am I doing wrong (I have all the cards installed in HACS and in Lovelace)
Thanks
carltonb
There’s most likely no history available for the entities.
See recorder and make sure it’s setup, working & recording the entities correctly.
Thank you for the hint.
Stupid yaml spacing on my part failed the recorder.yaml file.
Appreciate it.
2 Likes
for some reason my graphs are not showing. any idea where i should look for. did re-installation too but no luck.
color_thresholds:
- color: '#ff0505'
value: 74
- color: '#ff7a05'
value: 70
- color: '#ffcd05'
value: 65
entities:
- sensor.cpu_temperature
show:
labels: true
type: 'custom:mini-graph-card'
Yes, this 
2 Likes
Thanks! it was a bad DB file - deleted and restated all back to normal.
Hi, I am new to Home assistant and still trying to wrap my head around it, but mini graph card fascinated me so much, i need it to work from day 0. I have tried to install it using HACS (version 1.1.1). It added itself to lovelace resources as /hacsfiles/mini-graph-card/mini-graph-card-bundle.js
Copied files mini-graph-card-bundle.js (and .gz) to /config/www/community/mini-graph-card but when i try to create entity i got error:
I read a lot about hacsfiles directory, and I am confused that I haven’t got it. I tried to create it (as in resources) and copy files into it, but it didn’t work (also after restarting HA).
Thank you for great work. Looking forward to get it done.
Remove the ‘-’ character before the ‘type’, something like this:
type: 'custom:mini-graph-card'
entities:
- entity: sensor.disk_use_percent_home
1 Like
OMG, this easy? Thank you!
Then why the exapmles uses dash?
That is how they would be used if using YAML mode and not the UI.
2 Likes
try this -
type: 'custom:mini-graph-card'
entities:
- sensor.temperature
(eg remove the indentation and - )
Ahh - that will teach me to be interrupted as I’m about to press send…
3 Likes
Will there be a new release this summer?
Is it possible to specify the decimal count per entity?
I’m displaying three entities in my card but the decimal count should vary. So far I only found the setting to specify decimals per card?
1 Like