[CARTE] Apexcharts-card

Bonjour à tous,

J’ai finalement réussi à trouver une solution :

Les annotation suffisaient, il faut utiliser y et y2 pour la zone grisée :

annotations:
  position: 'front'
  yaxis:
    - y: "[[[ return variables.annotations.min.value; ]]]"
      y2: "[[[ return variables.annotations.max.value; ]]]"
      opacity: 0.2
    - y: "[[[ return variables.annotations.max.value; ]]]"
      strokeDashArray: 0
      label:
        text: "[[[ return variables.annotations.max.text; ]]]"
        offsetX: -5
        offsetY: -1
        style:
          fontSize: 8px
    - y: "[[[ return variables.annotations.min.value; ]]]"
      strokeDashArray: 0
      label:
        text: "[[[ return variables.annotations.min.text; ]]]"
        offsetX: -5
        offsetY: -1
        style:
          fontSize: 8px
2 « J'aime »

C’est tout simplement magnifique
Pourriez-vous partager le code complet de cette carte ? (avec si possible des explications) ? notamment sur les mini graphiques

Je ferrais un post quand j’aurais terminé ma carte de piscine en essayant d’expliquer les choses. Sur les graphiques j’ai encore un petit soucis : Quand j’utilise l’option : “fill_raw: last” ca me crée comme une entrée complémentaire avant la première valeur et du coup ca déborde sur la gauche… :frowning:

3 « J'aime »

[quote=« Matilas, post:53, topic:2686 »]

Pourrais tu partager le code de ta carte ? Merci

bonjour

je cherche à additionner la valeur de 2 entités et à l’afficher , mais je n’arrive pas à trouver la maniere d’additionner les entités auriez vous une solution ?
merci

Merci pour les infos (désolé pour la réponse tardive j’ai eu une grosse absence)

Le code est dans mon post initial, non ? Si tu veux plus d’infos, on peut voir en DM ?

Comme @saniho l’a répondu, c’est normal parce que Home Assistant remplit son historique à partir des informations temps réel, alors que parfois Enedis modifie des informations dans le passé (à mesure qu’elles deviennent correctes). La carte Enedis ne récupère pas les infos depuis l’historique de Home Assitant (le recorder) mais dans les attributs du sensor Enedis.

Et c’est là que tu peux jouer: tu peux créer un historique de toutes pièces à partir des attributs, en utilisant la fonction data_generator d’ApexChartsCard. La documentation est ici: GitHub - RomRider/apexcharts-card: 📈 A Lovelace card to display advanced graphs and charts based on ApexChartsJS for Home Assistant (désolé pas de lien mon compte est trop récent) avec un exemple qui devrait te permettre de t’en sortir.

Salut Arnault, ta carte utilise seulement le custom apexcharts-card ?

Bonjour @Pierre_Ma, j’utilise essentiellement les custom:button-card et j’y ai intégré apexcharts dedans

Bonjour @Arnault tu partagerai le code de ce type de carte ?

Hello tous le monde !

Je sais pas si je peux poster içi, n’hésitez pas à me dire si je dois ouvrir un post spécifique.

Voilà je n’arrive pas à fixer le nombre de décimale à « 1 » du total de mon donut. Après pas mal de recherche et d’essai, je pense que la solution est dans l’option « formatter » mais je n’arrive pas à comprendre comment fonctionne cette partie. juste qu’elle prend le paramètre « w » qui semble contenir les objets ce qui ne me parle pas vraiment.

Si quelqu’un peut m’aider à comprendre comment utiliser ceci , ce serait super cool !

Extrait de la doc dispo ICI

Mon soucis de décimale sur le total :

Le code de ma carte :

type: custom:apexcharts-card
chart_type: donut
header:
  show: true
  title: Répartition énergétique journalière
  show_states: true
  colorize_states: true
apex_config:
  dataLabels:
    formatter: |
      EVAL:function(value) {
        return value.toFixed(0) + "%";
      }
  plotOptions:
    pie:
      donut:
        labels:
          show: true
          total:
            show: true
series:
  - entity: sensor.bilan_autoconso_gain_3000wc_now
    name: Prod. solaire
    float_precision: 1
    color: '#2ECC71'
  - entity: sensor.daily_lg_chem_total_energy_saved
    name: Fourn. batteries
    float_precision: 1
    color: '#3498DB'
  - entity: sensor.daily_lg_chem_simulated_grid_export_after_battery_charging
    name: Réinj. ENEDIS
    float_precision: 1
    color: '#8E44AD'
  - entity: sensor.daily_lg_chem_simulated_grid_import_after_battery_discharging
    name: Conso ENEDIS
    float_precision: 1
    color: '#E74C3C'

Je me réponds à moi même, j’ai finalement trouvé la solution :

type: custom:apexcharts-card
chart_type: donut
header:
  show: true
  title: Répartition énergétique journalière
  show_states: true
  colorize_states: true
apex_config:
  dataLabels:
    formatter: |
      EVAL:function(value) {
        return value.toFixed(0) + " %";
      }
  plotOptions:
    pie:
      donut:
        labels:
          show: true
          total:
            show: true
            label: Total
            formatter: |
              EVAL:function(w) {
                return w.globals.seriesTotals.reduce((a, b) => {return (a + b)} , 0).toFixed(1) + " kWh"
                }
series:
  - entity: sensor.bilan_autoconso_gain_3000wc_now
    name: Prod. solaire
    float_precision: 1
    color: '#2ECC71'
  - entity: sensor.daily_lg_chem_total_energy_saved
    name: Fourn. batteries
    float_precision: 1
    color: '#3498DB'
  - entity: sensor.daily_lg_chem_simulated_grid_export_after_battery_charging
    name: Réinj. ENEDIS
    float_precision: 1
    color: '#8E44AD'
  - entity: sensor.daily_lg_chem_simulated_grid_import_after_battery_discharging
    name: Conso ENEDIS
    float_precision: 1
    color: '#E74C3C'

3 « J'aime »

Bonjour,

J’ai crée un simple graphique en colonne, pour ma production photovoltaïque.

J’aimerai afficher en haut de chaque barre les productions en kwh.

J’ai vu que normalement je dois ajouter

show:
datalabels: true

Mais j’ai un message d’erreur

/// apexcharts-card version 2.0.1 /// value.show is not an object value.datalabels is extraneous

Merci

@Jeremy

Essai cela

type: custom:apexcharts-card
graph_span: 7d
span:
  start: day
  offset: '-7d'
stacked: true
header:
  show: false
  title: Conso à 7 jours
apex_config:
  chart:
    type: area
    height: 400
  stroke:
    show: true
    width: 1
    curve: smooth
  legend:
    show: true
  fill:
    type: gradient
    gradient:
      shadeIntensity: 0.1
      opacityFrom: 0.25
      opacityTo: 1
      inverseColors: true
      stops:
        - 0
        - 90
        - 100
series:
  - color: rgb(138,43,226)
    entity: sensor.enedisgateway_212xxxxxxxx249
    type: column
    group_by:
      func: diff
      duration: 24h
    show:
      datalabels: true

Merci beaucoup sa ma bien aidé

autre question, est il possible de faire défilé un graphique ?

299747080_594200332171786_4725664990660192263_n (1)

Sue cette image j’ai une heure de production photovoltaïque, j’aimerai pouvoir revenir en arrière. Est-ce possible ?

merci

Bonjour à tous,

Quelqu’un sais pourquoi mes graphiques des valeurs fausses

pour aujourd’hui j’ai une production photovoltaïque de 15Kwh mais le graphique me donne que 9kwh

La sensor.photovoltaique_total_energy affiche bien 15Kwh mais pas dans mon graphique.

pourquoi ?

Est-ce la fonction ci-dessous qui pose problème ?

    group_by:
      func: diff

Merci

type: custom:apexcharts-card
graph_span: 15d
span:
  start: day
  offset: '-9d'
stacked: true
header:
  show: true
  title: Production à 15 jours
  show_states: true
apex_config:
  chart:
    type: area
    height: auto
  stroke:
    show: true
    width: 1
    curve: smooth
  legend:
    show: true
  fill:
    type: gradient
    gradient:
      shadeIntensity: 0.1
      opacityFrom: 0.25
      opacityTo: 1
      inverseColors: true
      stops:
        - 0
        - 90
        - 100
series:
  - color: rgb(37,49,217)
    entity: sensor.photovoltaique_total_energy
    type: column
    group_by:
      func: diff
      duration: 24h
    show:
      datalabels: true

un petit up , par contre si c’est impossible merci de me le dire :slight_smile:

Voici un graphe que j’ai fais pour visualiser rapidement les températures et précipitations des trois derniers jours et des deux jours à venir.

Le code si jamais…

type: custom:apexcharts-card
graph_span: 4d
all_series_config:
  stroke_width: 2
yaxis:
  - id: first
    show: true
    apex_config:
      tickAmount: 4
      title:
        text: °C
      forceNiceScale: false
      decimalsInFloat: false
  - id: second
    show: true
    opposite: true
    apex_config:
      title:
        text: mm
      tickAmount: 4
      decimalsInFloat: false
span:
  start: day
  offset: '-2d'
header:
  show: true
  show_states: true
  title: Météo
now:
  show: true
  label: Maintenant
apex_config:
  dataLabels:
    enabled: false
series:
  - entity: weather.openweathermap
    yaxis_id: first
    name: Temperature
    show:
      extremas: true
      in_header: true
      legend_value: false
    unit: °C
    attribute: temperature
    curve: smooth
    extend_to: now
    fill_raw: last
    group_by:
      func: avg
      duration: 1h
  - entity: weather.saint_sylvestre
    show:
      legend_value: false
      in_header: false
    yaxis_id: first
    name: Prévision °C
    curve: smooth
    type: line
    color: e36f9a
    extend_to: end
    data_generator: |
      return entity.attributes.forecast.map((entry) => {
        return [new Date(entry.datetime).getTime(), entry.temperature];
      });
  - entity: sensor.saint_sylvestre_daily_precipitation
    yaxis_id: second
    show:
      legend_value: false
      in_header: false
    color: 2ba6c2
    stroke_width: 4
    curve: smooth
    name: Pluie
    type: column
    group_by:
      duration: 4h
      func: last
      fill: last
  - entity: weather.saint_sylvestre
    yaxis_id: second
    name: Précipitation à venir
    stroke_width: 4
    type: column
    show:
      legend_value: false
      in_header: false
    color: cyan
    extend_to: end
    group_by:
      duration: 4h
      func: last
      fill: last
    data_generator: |
      return entity.attributes.forecast.map((entry) => {
        return [new Date(entry.datetime).getTime(), entry.precipitation];
      });

3 « J'aime »

Cool mais tu es où pour avoir tant de pluie, pas en Bretagne j’imagine :rofl:

Rhaaa le Bretagne c’est bizarrement foutu ! Tu regardes la météo : il y toujours de la pluie. Tu écoutes les locaux : il y a toujours du grand soleil… Moi je pense que c’est fait exprès pour pas envie de venir aux Parisiens !

1 « J'aime »