Quel type de carte pour capteur température + humidité?

herveaurel · Février 12, 2024, 2:17

Oui, pour faire des graph.

Y’a le lien dans mon github (et tous mes codes)

MilesTEG1 · Février 12, 2024, 2:39

Oh, j’aime beaucoup !!

Purée, je n’avais pas d’idée avant, maintenant j’en ai trop

BBE · Février 12, 2024, 2:46

Tiens encore une autre:

Un petit mushroom template, ici combiné avec le contrôle d’une lampe :

le "code" une ligne:

bon j’ai pas de capteur d’humidité alors j’ai mis 2x la température pour l’exemple…

type: custom:mushroom-template-card
primary: Bureau
secondary: >-
  Temperature: {{states('sensor.pac_room_temperature')}}°C / Humidité:
  {{states('sensor.pac_room_temperature')}}% 
icon: mdi:lightbulb
entity: light.ampoule_bureau
multiline_secondary: false
icon_color: |-
  {% if states(entity) == 'on' %}
  orange
  {% elif states(entity) == 'off' %}
  grey
  {% endif %}
tap_action:
  action: toggle
hold_action:
  action: more-info
double_tap_action:
  action: more-info

Ou alors grouper toutes les infos dans des « room cards »: je n’ai que des temperatures, pas de capteur d’humidité, mais c’est le même principe…:

LeLapinFou · Février 12, 2024, 3:12

après, si tu aime les affichages autres que courbes, il y a des trucs comme ça :

etc…

WarC0zes · Février 12, 2024, 3:21

Ta ce style de carte que Yael avait faite Carte thermomètre pour tableau de bord - #14 par anon41081891 avec button-card:

FROlCi · Février 13, 2024, 11:04

Hello, et si tu veux creuser la partie YAML comme expliquée par @LeLapinFou check le début de cet article Les cartes et MyelectricalData ou je fais référence à l’interface minimalist qui pourra t’aider dans ce type d’approche.

MilesTEG1 · Février 13, 2024, 12:10

@FROlCi Je vais regarder pour ce thème-là. Mais de ce que j’ai lu, faut tout coder, pas d’interface visuelle pour…
À voir.

@WarC0zes et @LeLapinFou C’est trop gros ^^ Joli, mais trop d’espace occupé.
Merci en tout cas pour vos propositions ^^

LeLapinFou · Février 13, 2024, 3:18

la grosseur et l’espace occupées par une carte se gère via yaml

MilesTEG1 · Février 13, 2024, 3:40

Certes, mais pour ces cartes, si elles sont trop petites, elles deviendront illisibles…

LeLapinFou · Février 13, 2024, 3:48

ou

ou

même taille

MilesTEG1 · Février 13, 2024, 3:50

Mes yeux me disent qu’ils ont du mal avec la dernière qu’ils trouvent un peu illisible

je préfère la seconde

Je pense que je vais partir dessus, avec un clic dessus qui ouvre le graphique de ta première carte
Reste à réussir à faire ça

LeLapinFou · Février 13, 2024, 3:53

yes, ma copie d’écran est un peu pourrie, je te l’accorde
une copie de la copie qui est copié

BBE · Février 13, 2024, 4:21

Si tu aimes bien le look de minimalist, mais que tu veux rester sur de l’interface simple avec l’UI, je t’invites à regarder la collection de cartes mushroom dispo dans HACS (qui est compatible du look des Tuiles ou tiles HA tout en permettant de faire plus de choses… avec l’UI).

C’est une façon de créer simplement, avec l’UI, un dashboard type minimalist…

Et si tu veux faire une room card simple a partir de mushroom, je t’invite à jeter un oeil sur mon post là:
[carte] mise en forme de ma mushroom room card
Et en particulier une version simplifiée avec la procédure pas à pas si tu veux tester:
version simplifiée pas à pas

Ca te permet de créer assez simplement des cartes entièrement customisables comme celles là:

Sabju · Avril 8, 2024, 5:07

Bonjour
J’ai essayé de refaire la même chose, mais je trouve que chez moi il y a bcp d’espace à l’affichage entre les différentes pièces de la maison …
Une idée pour que ça soit moins espacée ?

Merci beaucoup

MilesTEG1 · Avril 8, 2024, 7:37

Bonsoir ,
Moi j’ai ça comme code :


type: vertical-stack
cards:
  - type: custom:text-divider-row
    text: Netatmo Salon
  - type: horizontal-stack
    cards:
      - type: custom:mushroom-entity-card
        entity: sensor.netatmo_salon_temperature
        primary_info: state
        secondary_info: none
        icon_color: pink
      - type: custom:mushroom-entity-card
        entity: sensor.netatmo_salon_humidity
        primary_info: state
        secondary_info: none
      - type: custom:mushroom-entity-card
        entity: null
        primary_info: state
        secondary_info: none
        icon_color: amber
  - type: horizontal-stack
    cards:
      - type: custom:mushroom-entity-card
        entity: sensor.netatmo_salon_co2
        primary_info: state
        secondary_info: none
        icon_color: pink
      - type: custom:mushroom-entity-card
        entity: sensor.netatmo_salon_noise
        primary_info: state
        secondary_info: none
      - type: custom:mushroom-entity-card
        entity: sensor.netatmo_salon_pressure
        primary_info: state
        secondary_info: none
        icon_color: amber
  - type: custom:text-divider-row
    text: Capteurs Tuya n°1 - Garage Switch Caméra
  - type: horizontal-stack
    cards:
      - type: custom:mushroom-entity-card
        entity: sensor.tuya_t_h_01_garage_switch_cameras_temperature
        primary_info: state
        secondary_info: none
        icon_color: pink
      - type: custom:mushroom-entity-card
        entity: sensor.tuya_t_h_01_garage_switch_cameras_humidity
        primary_info: state
        secondary_info: none
      - type: custom:mushroom-entity-card
        entity: sensor.tuya_t_h_01_garage_switch_cameras_battery
        primary_info: state
        secondary_info: none
        icon_color: amber
  - type: custom:text-divider-row
    text: Capteurs Tuya n°2
  - type: horizontal-stack
    cards:
      - type: custom:mushroom-entity-card
        entity: sensor.tuya_t_h_02_temperature
        primary_info: state
        secondary_info: none
        icon_color: pink
      - type: custom:mushroom-entity-card
        entity: sensor.tuya_t_h_02_humidity
        primary_info: state
        secondary_info: none
      - type: custom:mushroom-entity-card
        entity: sensor.tuya_t_h_02_battery
        primary_info: state
        secondary_info: none
        icon_color: amber
  - type: custom:text-divider-row
    text: Capteurs Tuya n°3 - Salle de bains
  - type: horizontal-stack
    cards:
      - type: custom:mushroom-entity-card
        entity: sensor.tuya_t_h_03_salle_de_bains_temperature
        primary_info: state
        secondary_info: none
        icon_color: pink
      - type: custom:mushroom-entity-card
        entity: sensor.tuya_t_h_03_salle_de_bains_humidity
        primary_info: state
        secondary_info: none
      - type: custom:mushroom-entity-card
        entity: sensor.tuya_t_h_03_salle_de_bains_battery
        primary_info: state
        secondary_info: none
        icon_color: amber
  - type: custom:text-divider-row
    text: Capteurs Tuya n°4 - WC
  - type: horizontal-stack
    cards:
      - type: custom:mushroom-entity-card
        entity: sensor.tuya_t_h_04_toilettes_temperature
        primary_info: state
        secondary_info: none
        icon_color: pink
      - type: custom:mushroom-entity-card
        entity: sensor.tuya_t_h_04_toilettes_humidity
        primary_info: state
        secondary_info: none
      - type: custom:mushroom-entity-card
        entity: sensor.tuya_t_h_04_toilettes_battery
        primary_info: state
        secondary_info: none
        icon_color: amber

Mais au final je trouve ça moins lisible (sur mobile , et j’ai un iPhone 15+) que les graphiques suivants :


type: vertical-stack
cards:
  - type: custom:text-divider-row
    text: Températures des pièces 🌡️
  - type: horizontal-stack
    cards:
      - type: custom:mini-graph-card
        name: Netatmo - Extérieur
        icon: mdi:thermometer
        line_width: 4
        font_size_header: 10
        font_size: 100
        hours_to_show: 12
        points_per_hour: 6
        line_color: '#8bc34a'
        entities:
          - sensor.netatmo_garage_temperature
      - type: custom:mini-graph-card
        name: Netatmo - Pression Atm.
        icon: mdi:gauge
        line_width: 4
        font_size_header: 10
        font_size: 100
        hours_to_show: 12
        points_per_hour: 6
        line_color: '#3f51b5'
        entities:
          - sensor.netatmo_salon_pressure
  - type: horizontal-stack
    cards:
      - type: custom:mini-graph-card
        name: Netatmo - Salon
        icon: mdi:thermometer
        line_width: 4
        font_size_header: 10
        font_size: 100
        hours_to_show: 12
        points_per_hour: 6
        line_color: '#f44336'
        entities:
          - sensor.netatmo_salon_temperature
      - type: custom:mini-graph-card
        name: Netatmo - Bureau
        icon: mdi:thermometer
        line_width: 4
        font_size_header: 10
        font_size: 100
        hours_to_show: 12
        points_per_hour: 6
        line_color: '#ba68c8'
        entities:
          - sensor.netatmo_bureau_temperature
  - type: horizontal-stack
    cards:
      - type: custom:mini-graph-card
        name: Netatmo - Ch. Parents
        icon: mdi:thermometer
        line_width: 4
        font_size_header: 10
        font_size: 100
        hours_to_show: 12
        points_per_hour: 6
        line_color: '#2196f3'
        entities:
          - sensor.netatmo_chambre_temperature
      - type: custom:mini-graph-card
        name: Netatmo - Ch. Charlotte
        icon: mdi:thermometer
        line_width: 4
        font_size_header: 10
        font_size: 100
        hours_to_show: 12
        points_per_hour: 6
        line_color: '#1abc9c'
        entities:
          - sensor.netatmo_chambre_charlotte_temperature
  - type: horizontal-stack
    cards:
      - type: custom:mini-graph-card
        name: Tuya n°1 - Garage (bas)
        icon: mdi:garage
        line_width: 4
        font_size_header: 10
        font_size: 100
        hours_to_show: 12
        points_per_hour: 6
        line_color: '#cddc39'
        entities:
          - sensor.tuya_t_h_01_garage_switch_cameras_temperature
      - type: custom:mini-graph-card
        name: Tuya n°2
        icon: mdi:thermometer
        line_width: 4
        font_size_header: 10
        font_size: 100
        hours_to_show: 12
        points_per_hour: 6
        line_color: '#ff9800'
        entities:
          - sensor.tuya_t_h_02_temperature
  - type: horizontal-stack
    cards:
      - type: custom:mini-graph-card
        name: Tuya n°3 - Salle de bains
        icon: mdi:thermometer
        line_width: 4
        font_size_header: 10
        font_size: 100
        hours_to_show: 12
        points_per_hour: 6
        line_color: '#00bcd4'
        entities:
          - sensor.tuya_t_h_03_salle_de_bains_temperature
      - type: custom:mini-graph-card
        name: Tuya n°4 - WC
        icon: mdi:thermometer
        line_width: 4
        font_size_header: 10
        font_size: 100
        hours_to_show: 12
        points_per_hour: 6
        line_color: '#ffeb3b'
        entities:
          - sensor.tuya_t_h_04_toilettes_temperature

titoumimi · Avril 8, 2024, 7:59

de mon côté, j’ai décidé de changer de mise ne page :

      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.temperature_salon
              icon_color: pink
            - type: entity
              entity: sensor.humidite_salon
              icon_color: cyan
            - type: entity
              entity: sensor.etat_batterie_salon
              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.temperature_salon
              name: Température
              show_legend: true
              y_axis: secondary
            - entity: sensor.humidite_salon
              name: Humidité
              show_legend: true
          show:
            fill: true
            graph: line
            icon: false
            name: false
            state: false
            labels: true
            extrema: true
            icon_adaptive_color: false
            labels_secondary: true

denisb88 · Avril 24, 2024, 10:00

Superbe, y aurait moyen d’avoir le code d’une carte de température avec Apex ?
Je n’arrive pas à trouver dans le lovelace.
Merci d’avance

herveaurel · Avril 25, 2024, 8:52

Etant re-passé a un affichage plus classique, et mon Git n’étant pas encore a jour, il faut chercher dedans avant que je le mette a jour.
Je conseille d’utiliser la fonction rechercher avec un ou des mots clé pour trouver quelque chose.

denisb88 · Avril 25, 2024, 11:53

Bon tant pis, je vais chercher autre chose alors, c’est dommage ça me plaisait bien mais je crains de ne pas pouvoir retrouver le code sur le GitHub
Merci quand même

WarC0zes · Avril 26, 2024, 3:21

Salut,
comme il a expliquer , avec la recherche d’un mot, tu trouve facilement.

pour la carte de droite Etage ( ou Étage avec accent )

github.com

herveaurel/HomeAssistant/blob/main/lovelace.yaml#L9644


      
                                hum_state: >-
                                  [[[ return
                                  states['sensor.sonde_garage_humidite'].state ]]]
                                temp_trend: >-
                                  [[[ return
                                  states['sensor.temp_garage_tendance_icon'].state
                                  ]]]
                              template:
                                - climat_card
                          columns: 2
          - type: custom:layout-card
            layout_type: masonry
            layout:
              width: 320
            cards:
              - type: entities
                card_mod:
                  style: |
                    ha-card { 
                     background-color: var(--card-background-color);
                     }

pour la carte de gauche Rez-de-chaussée

github.com

herveaurel/HomeAssistant/blob/main/lovelace.yaml#L9518


      
          path: Temp
          icon: mdi:thermometer
          subview: false
          layout:
            width: 350
            max_cols: 4
          type: custom:horizontal-layout
          badge_cards: []
          badges: []
          cards:
            - type: custom:layout-card
              layout_type: masonry
              layout:
                width: 320
              cards:
                - type: entities
                  card_mod:
                    style: |
                      ha-card { 
                       background-color: var(--card-background-color);
                       }