Bruk av AI for å generere YAML kode i HA. Eksempel: Apex charts for å fargekode billigste og dyreste strømpriser

[Teknor]

Har i noen måneder brukt uike verktøy til å enkelt generere yaml kode kun ved å beskrive behovene mine. Blir bare mer og mer imponert over utviklingen og hva det er mulig å få til - dersom spørsmålene stilles riktig - med høyst begrensede programmeringskunnskaper.

 

Et eksempel er denne som fargekoder timene basert på rangering av strømprisen:

type: custom:apexcharts-card
series:
  - entity: sensor.nordpool_kwh_oslo_nok_3_10_0
    name: Pris
    type: column
    float_precision: 4
    data_generator: >
      const today = entity.attributes.raw_today;
      const tomorrow = entity.attributes.raw_tomorrow;
      const allData = today.concat(tomorrow);
      
      const categorizeHours = (data) => {
        const sorted = [...data].sort((a, b) => a.value - b.value);
        const categories = {
          lowestFour: sorted.slice(0, 4).map(p => p.start),
          nextFour: sorted.slice(4, 8).map(p => p.start),
          middle: sorted.slice(8, 16).map(p => p.start),
          nextHighestFour: sorted.slice(16, 20).map(p => p.start),
          highestFour: sorted.slice(20).map(p => p.start)
        };
        return categories;
      };

      const todayCategories = categorizeHours(today);
      const tomorrowCategories = categorizeHours(tomorrow);

      const getColor = (start) => {
        for (const day of [todayCategories, tomorrowCategories]) {
          if (day.lowestFour.includes(start)) return '#006400';  // Dark Green
          if (day.nextFour.includes(start)) return '#90EE90';    // Light Green
          if (day.middle.includes(start)) return '#1E90FF';      // Blue
          if (day.nextHighestFour.includes(start)) return '#FFA500';  // Orange
          if (day.highestFour.includes(start)) return '#FF0000';  // Red
        }
        return '#808080';  // Default Gray (shouldn't occur)
      };

      return allData.map(p => ({
        x: new Date(p.start).getTime(),
        y: p.value,
        fillColor: getColor(p.start)
      }));
now:
  show: true
  label: Nå
graph_span: 2d
span:
  start: day
locale: nb
apex_config:
  chart:
    height: 300px
    zoom:
      enabled: true
    toolbar:
      show: true
      tools:
        zoom: true
        zoomin: false
        zoomout: false
        pan: false
        reset: true
  legend:
    show: false
  dataLabels:
    enabled: false
  xaxis:
    type: datetime
    labels:
      datetimeFormatter:
        month: ddd
        day: ddd
  yaxis:
    forceNiceScale: false
    min: 0
  plotOptions:
    bar:
      columnWidth: '95%'

 

 

 

På den måten kan jeg se når f.eks. varmekabler på bad og VVB er aktvert (som begge er aktivert på døgnets 8 billigste timer, altså mørkegrønne og lysegrønne farger).

 

Etter nærmere ettertanke kan VVB og varmekabler uansett være aktivert om prisen er under 0.2 kroner.

 

Gir derfor AI-assistenten følgende beskjed:

can you modify the code and make all bars dark green if the value is bellow 0.2?

 

og jeg får dette resultatet:

Answer

Certainly! I'll modify the code to make all bars dark green if their value is below 0.2, while keeping the color categorization for the rest. Here's the updated version:

 

type: custom:apexcharts-card
series:
  - entity: sensor.nordpool_kwh_oslo_nok_3_10_0
    name: Pris
    type: column
    float_precision: 4
    data_generator: >
      const today = entity.attributes.raw_today;
      const tomorrow = entity.attributes.raw_tomorrow;
      const allData = today.concat(tomorrow);
      
      const categorizeHours = (data) => {
        const sorted = [...data].sort((a, b) => b.value - a.value);  // Sort descending
        const categories = {
          highestFour: sorted.slice(0, 4).map(p => p.start),
          nextHighestFour: sorted.slice(4, 8).map(p => p.start),
          middle: sorted.slice(8, 16).map(p => p.start),
          nextLowestFour: sorted.slice(16, 20).map(p => p.start),
          lowestFour: sorted.slice(20).map(p => p.start)
        };
        return categories;
      };

      const todayCategories = categorizeHours(today);
      const tomorrowCategories = categorizeHours(tomorrow);

      const getColor = (start, value) => {
        if (value < 0.2) return '#006400';  // Dark Green for values below 0.2
        for (const day of [todayCategories, tomorrowCategories]) {
          if (day.highestFour.includes(start)) return '#FF0000';   // Red
          if (day.nextHighestFour.includes(start)) return '#FFA500';  // Orange
          if (day.middle.includes(start)) return '#1E90FF';      // Blue
          if (day.nextLowestFour.includes(start)) return '#90EE90';    // Light Green
          if (day.lowestFour.includes(start)) return '#00FF00';   // Green
        }
        return '#808080';  // Default Gray (shouldn't occur)
      };

      return allData.map(p => ({
        x: new Date(p.start).getTime(),
        y: p.value,
        fillColor: getColor(p.start, p.value)
      }));
now:
  show: true
  label: Nå
graph_span: 2d
span:
  start: day
locale: nb
apex_config:
  chart:
    height: 300px
    zoom:
      enabled: true
    toolbar:
      show: true
      tools:
        zoom: true
        zoomin: false
        zoomout: false
        pan: false
        reset: true
  legend:
    show: false
  dataLabels:
    enabled: false
  xaxis:
    type: datetime
    labels:
      datetimeFormatter:
        month: ddd
        day: ddd
  yaxis:
    forceNiceScale: false
    min: 0
  plotOptions:
    bar:
      columnWidth: '95%'

 

Som gir meg denne:

 

...så kan jeg lage automasjonene tilsvarende.

 

Andre som har fått tilsvarende hjelp?

Endret 10. september av Teknor