Thanks! nevertheless there is still a large unused space above the graph. 
(wouldnāt mind some 10ish pixels, but ā¦ (highest green part is 100%)
Try it here:
I am trying to create a view with 8 graphs for a tablet.
The graphs are divided into four rows and 2 columns using vertical and horizontal stacks.
The layout fits, but the graphs are way too big, so you have to scroll down the page.
How do I get it adjusted so that all graphs are displayed on one page?
Start with playing with fonts & graphās height - there are native cardās options for these things.
If it is not enough - some alterations may be done by card-mod which is a bit more difficult way, so start with the 1st step.
have no idea howā¦ can you give some examples?
type: vertical-stack
cards:
- type: custom:mini-graph-card
entities:
- entity: sensor.processor_use
- type: custom:mini-graph-card
entities:
- entity: sensor.processor_use
font_size: 30
font_size_header: 25
height: 30
1 Like
thank you , that helps!
Hi, Do you have the code to recreate this? Iād love to have it as my header card for all my rooms. Iāve searched a small way back through the thread but canāt find it.
This is achieved by card-mod. Try playing with it. Try, learn, make mistakes, try - this is the Way.
I have tried and I am also learning but struggling to replicate it. Iām using card mod already via custom stack in cards.
States are placed inside a flex. You may place the 2nd state to the left. Then place them both above the graph.
Icons are tricky. A possible way is to add them as images (not icons) to ā:beforeā pseudo classes.
Google in card-mod thread for examples.
Thanks, Iām getting there, just trying to decide whether to leave the chip cards in top right or move them to bottom left.
You added another card overlayed?
Itās a combination of horizontal stacks and vertical stacks with card mod to move things a bit closer together.
I see. By using a stack you may overlay cards.
Suggest to post your code here for people who are interested.
1 Like
How can I show the name of the second entity above the state, similar to how the primary entity shows its name? Using .states--secondary::before added some text above the second state, and Iād be fine with the same formatting of the primary state name, but if I try before on the primary state it messes with the alignment:
- type: custom:mini-graph-card
line_width: 3
lower_bound: 10
upper_bound: 30
show:
min: true
name: true
icon: false
legend: false
fill: fade
color_thresholds:
- value: 25
color: red
- color: orange
- value: 15
color: blue
entities:
- entity: climate.back_room_radiator
attribute: current_temperature
name: Current
unit: Ā°C
show_state: true
- entity: climate.back_room_radiator
attribute: temperature
name: Target
unit: Ā°C
show_state: true
color: mediumpurple
Hello all,
I have found the example of how to display additional information on the card. I would like to display the battery status in form of an icon. Has anyone done this before?
Hello,
How can I call a service by tap action option? Iām trying to call input_select.select_option service but it fails although in developer tools, calling this service is working. What am I missing?
Here is my card:
type: custom:mini-graph-card
entities:
- entity: sensor.consum_total_apartament_power
name: Putere Consumata Apartament
color: '#4caf50'
hours_to_show: 24
line_width: 3
font_size: 50
animate: true
show:
name: true
icon: false
state: true
legend: true
fill: fade
tap_action:
action: call-service
service: input_select.select_option
data:
option: consum_apart
target:
entity_id: input_select.input_select_minimalist_ui
According to Docs as usual.
Some custom cards have āaction dataā a bit different than a standard one. Not to mention a a difference between āservice callā in different standard cards & āservice callā in other places.
1 Like
Similarly to my last question, how can I prefix each state separately? Using .states.flex .state .state__value.ellipsis::before { as per this example applies the same prefix to both states
