Merci pour ton aide précieuse , trop fort ![]()
Bon je n’y arrive pas, j’ai beau recopier le code, le modifier, ça mouline dans l’affichage de la carte et je ne vois aucune référence à la carte apex pourtant utilisée dans l’affichage
effectivement, pas de apexcharts-card pour c’est partie de code. Mais il en utilise pour d’autre chose.
recherche apexcharts-card , tu les trouvera. il utilise des decluttering_templates, pour les apex-chart.
tu peut tester ces codes.
pour faire des decluttering_templates, faut c’est carte.
Car c’est la partie template button card qu’il faut regarder.
Le template climat_card comme indiqué dans la carte.
@MilesTEG1 Je cherche à faire exactement ce que tu as fait sur la première image

Est ce que tu aurais ton code et quelle carte tu as utilisé stp ?
Merci ! ![]()
Ok merci je viens de voir ça, Top !
Bonjour,
Pour température et humidité, j’ai depuis longtemps ce genre de carte:

J’aime bien voir un petit historique des valeurs.
Je veux bien le code ^^
Même chose ^^
Me faudra faire ça en petit, j'ai pas la place d'afficher toutes mes sondes ainsi ^^
Ou alors, j'utilise les cartes de @herveaurel avec lien dessus pour ouvrir en popup ta carte plus détaillée ^^
(faudra que je trouve comment faire ça, d'ailleurs XD)
J’ai aussi la version en plus petit, pour mettre plusieurs sonde sur un seul écran sur mon NSPanel Pro:
Le code de ces petites cartes (c'est un popup):
Le code de ces petites cartes (c’est un popup):
type: custom:mini-graph-card
- card_mod:
style: |
.header {
padding-bottom: 0px;
}
.states {
padding-bottom: 0px;
}
ha-card {
height: 100px !important;
padding-top: 4px !important;
}
ha-card > div.header.flex > div > span {
opacity: 1;
}
entities:
- color: white
entity: sensor.interieur_temperature
name: Température
state_adaptive_color: true
- color: aqua
entity: sensor.interieur_humidity
name: Humidité
show_state: true
state_adaptive_color: true
y_axis: secondary
hour24: true
hours_to_show: 12
points_per_hour: 2
line_width: 3
name: Salon
align_header: center
font_size: 60
font_size_header: 15
show:
graphe: line
icon: false
legend: false
type: custom:mini-graph-card
- card_mod:
style: |
.header {
padding-bottom: 0px;
}
.states {
padding-bottom: 0px;
}
ha-card {
height: 100px !important;
padding-top: 4px !important;
}
ha-card > div.header.flex > div > span {
opacity: 1;
}
entities:
- color: white
entity: sensor.thermometre_chambre_agathe_digital_temperature
name: Température
state_adaptive_color: true
- color: aqua
entity: sensor.thermometre_chambre_agathe_digital_humidity
name: Humidité
show_state: true
state_adaptive_color: true
y_axis: secondary
hour24: true
hours_to_show: 12
points_per_hour: 2
line_width: 3
name: Ch. Agathe
align_header: center
font_size: 60
font_size_header: 15
show:
graphe: line
icon: false
legend: false
type: custom:mini-graph-card
- card_mod:
style: |
.header {
padding-bottom: 0px;
}
.states {
padding-bottom: 0px;
}
ha-card {
height: 100px !important;
padding-top: 4px !important;
}
ha-card > div.header.flex > div > span {
opacity: 1;
}
entities:
- color: white
entity: sensor.thermometre_chambre_parents_digital_temperature
name: Température
state_adaptive_color: true
- color: aqua
entity: sensor.thermometre_chambre_parents_digital_humidity
name: Humidité
show_state: true
state_adaptive_color: true
y_axis: secondary
hour24: true
hours_to_show: 12
points_per_hour: 2
line_width: 3
name: Ch. Parents
align_header: center
font_size: 60
font_size_header: 15
show:
graphe: line
icon: false
legend: false
type: custom:mini-graph-card
Le code de la carte plus grande et détaillée:
type: custom:mini-graph-card
name: Chambre Agathe
height: 120
hours_to_show: 48
points_per_hour: 1
hour24: true
line_width: 2
decimals: 1
entities:
- entity: sensor.thermometre_chambre_agathe_digital_temperature
name: Temp.
color: orange
- color: rgb(68, 115, 158)
entity: sensor.thermometre_chambre_agathe_digital_humidity
name: Humidité
show_line: true
show_points: true
show_legend: true
y_axis: secondary
show:
fill: true
graph: line
icon: true
name: true
state: true
labels: true
extrema: true
average: true
icon_adaptive_color: false
labels_secondary: true
align_icon: right
align_state: left
card_mod:
style: |
ha-card .header.flex .name.flex {
color: rgb(68, 115, 158);
}
ha-card .states.flex {
font-size: 13.5px;
}
ha-card .header.flex .icon {
color: orange;
}
ha-card .graph .graph__container .graph__labels {
color: rgb(68, 115, 158);
}
ha-card .states.flex::after {
content: "{{states('sensor.thermometre_chambre_agathe_digital_battery') | round(0)}} %" }};
{% if states('sensor.thermometre_chambre_agathe_digital_battery') < '20' %} background-color: rgba(255, 115, 158,0.4); {% else %} background-color: rgba(68, 115, 158,0.4); {% endif %}
white-space: pre;
padding: 2px 2px 0px 2px;
border-radius: 4px;
font-size: 9px;
}
ha-card {
margin: 0px -10px -30px -10px;
}
decluttering_templates:
thermometer_card:
card:
type: custom:stack-in-card
mode: vertical
keep:
background: true
box-shadow: true
margin: true
outer_padding: false
cards:
- type: vertical-stack
cards:
- type: custom:button-card
template:
- ball_card
- no_style
- temperature_mini_card_state
show_name: true
entity: '[[temperature]]'
name: '[[name]]'
label: |
[[[ return (entity.state* 1).toFixed(1) +"°" ]]]
styles:
card:
- z-index: 1
- margin-bottom: 30px
- type: custom:button-card
template:
- badge_auto_card
- no_style
- humidity_mini_card_state
show_name: false
entity: '[[humidity]]'
label: |
[[[ return (entity.state* 1).toFixed(1) +"%" ]]]
styles:
card:
- z-index: 1
- margin: 0
- padding: 0 0 0 5px
- type: custom:mini-graph-card
card_mod:
style: |
ha-card {
padding: 0px;
margin-top: -85px;
background: transparent;
overflow: visble !important;
z-index: 0
}
height: 170
hours_to_show: 48
points_per_hour: 2
hour24: true
smoothing: true
line_width: 1
line_color:
- rgba(var(--orange-rgb),0.9)
- rgba(var(--blue-rgb),0.4)
decimals: 1
entities:
- entity: '[[temperature]]'
name: Température
show_legend: false
smoothing: true
y_axis: secondary
- entity: '[[humidity]]'
name: Humidité
show_legend: false
smoothing: true
show:
fill: true
graph: line
icon: false
name: false
state: false
labels: false
extrema: false
icon_adaptive_color: false
labels_secondary: false
Pour les button-card-templates, tu peux les retrouver sur mon Github:
- base
- ball_card
- badge_card
- badge_auto_card
- no_style
- temperature_mini_card_state
- humidity_mini_card_state
C’est bien , ça relance le sujet pour une demande de code ![]()
Logique, ce sujet apparait dans les derniers modifiés, alors la curiosité chatouille, un p’tit clic pour voir, et on balance une info si y’en a une nouvelle ! ![]()
Bonjour, j’aime beaucoup j’essaye de reproduire mais je n’arrive absolument pas a faire la même chose
aurez vous le code a me faire parvenir s’il vous plaît
Déjà donné au dessus
hello un petit truc simple qui a un rendu sympa aussi :
type: custom:stack-in-card
mode: vertical
keep:
background: true
margin: true
outer_padding: true
cards:
- type: custom:mushroom-chips-card
chips:
- type: entity
entity: sensor.temp_0_ext_temperature
icon_color: pink
- type: entity
entity: sensor.temp_0_ext_humidity
icon_color: cyan
- type: entity
entity: sensor.temp_0_ext_battery
icon_color: amber
alignment: justify
- type: custom:mini-graph-card
height: 100
hours_to_show: 24
points_per_hour: 4
hour24: true
line_width: 4
line_color:
- crimson
- dodgerblue
decimals: 1
entities:
- entity: sensor.temp_0_ext_temperature
name: TEMP_EXT
show_legend: true
y_axis: secondary
- entity: sensor.temp_0_ext_humidity
name: Humidité
show_legend: true
show:
fill: true
graph: line
icon: true
name: true
state: true
labels: true
extrema: true
icon_adaptive_color: false
labels_secondary: true






