Skip to content
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo

Community Forum

  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. Diagramm mit festen Werten in VIS - nur wie?

NEWS

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    8.3k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    1.9k

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    15
    1
    2.3k

Diagramm mit festen Werten in VIS - nur wie?

Geplant Angeheftet Gesperrt Verschoben Visualisierung
63 Beiträge 19 Kommentatoren 8.9k Aufrufe 15 Watching
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • HomoranH Homoran

    @familienvater
    Duuuu?
    bist du das wirklich?

    Willkommen!
    Die Idee sit gut! habe ich noch nie drüber nachgedacht.
    Ich nehme an, dass sich die Werte "irgendwie" dynamisch verändern und dann auch immer aktuell dargestellt werden sollen.

    Während ich über eine Lösung nachdenke:
    Warum käme dann historisieren nicht in Frage?

    F Offline
    F Offline
    Familienvater
    schrieb am zuletzt editiert von
    #7

    @homoran

    ja ich bin es wirklich...

    Historisieren:
    Es wäre ja eher "futurisieren", weil es geht ja um die Visualisierung der Strompreise der nächsten Stunden.
    Historisieren im Sinne von ich schreibe die in eine Datenbank, und hebe mir nur die letzten (zukünftigen) x-Werte auf finde ich den absoluten Overkill, nur um 6-12 Werte zu historisieren eine komplette Datenbank-Instanz auf womöglich einem Raspi zuzufügen, plus 1-2 Adapter für Historisierung und Zugriff auf die historisierten Daten.

    Nee, Motto ist: "keep it small and simple"...
    Vis Material Design bin ich auch schon beim Suchen drüber gestolpert, das scheint sehr viel zu können, aber ich habe nur vis-material-advanced gefunden?

    Danke,
    Christian

    liv-in-skyL HomoranH 2 Antworten Letzte Antwort
    0
    • F Familienvater

      @homoran

      ja ich bin es wirklich...

      Historisieren:
      Es wäre ja eher "futurisieren", weil es geht ja um die Visualisierung der Strompreise der nächsten Stunden.
      Historisieren im Sinne von ich schreibe die in eine Datenbank, und hebe mir nur die letzten (zukünftigen) x-Werte auf finde ich den absoluten Overkill, nur um 6-12 Werte zu historisieren eine komplette Datenbank-Instanz auf womöglich einem Raspi zuzufügen, plus 1-2 Adapter für Historisierung und Zugriff auf die historisierten Daten.

      Nee, Motto ist: "keep it small and simple"...
      Vis Material Design bin ich auch schon beim Suchen drüber gestolpert, das scheint sehr viel zu können, aber ich habe nur vis-material-advanced gefunden?

      Danke,
      Christian

      liv-in-skyL Offline
      liv-in-skyL Offline
      liv-in-sky
      schrieb am zuletzt editiert von
      #8

      @familienvater

      Image 5.png

      nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

      1 Antwort Letzte Antwort
      0
      • F Familienvater

        @homoran

        ja ich bin es wirklich...

        Historisieren:
        Es wäre ja eher "futurisieren", weil es geht ja um die Visualisierung der Strompreise der nächsten Stunden.
        Historisieren im Sinne von ich schreibe die in eine Datenbank, und hebe mir nur die letzten (zukünftigen) x-Werte auf finde ich den absoluten Overkill, nur um 6-12 Werte zu historisieren eine komplette Datenbank-Instanz auf womöglich einem Raspi zuzufügen, plus 1-2 Adapter für Historisierung und Zugriff auf die historisierten Daten.

        Nee, Motto ist: "keep it small and simple"...
        Vis Material Design bin ich auch schon beim Suchen drüber gestolpert, das scheint sehr viel zu können, aber ich habe nur vis-material-advanced gefunden?

        Danke,
        Christian

        HomoranH Nicht stören
        HomoranH Nicht stören
        Homoran
        Global Moderator Administrators
        schrieb am zuletzt editiert von
        #9

        @familienvater sagte in Diagramm mit festen Werten in VIS - nur wie?:

        ich habe nur vis-material-advanced gefunden?

        Dann bist du brav im stable - da gibbet das nicht

        github:	0.5.59
        latest:	0.5.9 for 3 months
        stable:	-.-.-
        

        http://download.iobroker.net/list.html#sortCol=name&sortDir=0&filter=
        #399

        kein Support per PN! - Fragen im Forum stellen - es gibt fast nichts, was nicht auch für andere interessant ist.

        Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

        der Installationsfixer: curl -fsL https://iobroker.net/fix.sh | bash -

        1 Antwort Letzte Antwort
        0
        • F Offline
          F Offline
          Familienvater
          schrieb am zuletzt editiert von
          #10

          @homoran

          OK, ich habe es geschafft, das aus dem nicht-Stable zu Installieren, und auch aus dem großen Hilfe-Thread mit Beispiel-Daten was zu erzeugen (was mir mit der Anleitung anleine nicht gelungen ist).
          Erstmal Danke an alle, dann wird mir heute sicherlich nicht mehr langweilig.

          Danke,
          Christian

          HomoranH 1 Antwort Letzte Antwort
          1
          • F Familienvater

            @homoran

            OK, ich habe es geschafft, das aus dem nicht-Stable zu Installieren, und auch aus dem großen Hilfe-Thread mit Beispiel-Daten was zu erzeugen (was mir mit der Anleitung anleine nicht gelungen ist).
            Erstmal Danke an alle, dann wird mir heute sicherlich nicht mehr langweilig.

            Danke,
            Christian

            HomoranH Nicht stören
            HomoranH Nicht stören
            Homoran
            Global Moderator Administrators
            schrieb am zuletzt editiert von
            #11

            @familienvater sagte in Diagramm mit festen Werten in VIS - nur wie?:

            dann wird mir heute sicherlich nicht mehr langweilig.

            Dann mal viel Spaß!

            und zeig uns dein Ergebnis

            kein Support per PN! - Fragen im Forum stellen - es gibt fast nichts, was nicht auch für andere interessant ist.

            Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

            der Installationsfixer: curl -fsL https://iobroker.net/fix.sh | bash -

            F 1 Antwort Letzte Antwort
            0
            • HomoranH Homoran

              @familienvater sagte in Diagramm mit festen Werten in VIS - nur wie?:

              dann wird mir heute sicherlich nicht mehr langweilig.

              Dann mal viel Spaß!

              und zeig uns dein Ergebnis

              F Offline
              F Offline
              Familienvater
              schrieb am zuletzt editiert von Familienvater
              #12

              Moin,

              also mit dem JSON-Chart habe ich es nicht hinbekommen, aber mit dem Bar Chart hat es geklappt, und es ist ausreichend "hübsch":
              2021-10-08_17h59_03.png

              Zu meinem Code und als Entschuldigung: JavaScript ist nicht so meins :-), Kommentare sind immerhin überhaupt welche drin. Und die createChartData - Funktion ist das, was ich vergeblich für das JSON-Chart versucht hatte, vielleicht schleift das noch jemand rund...

              var myName = "tibber.createchartdata";
              
              var logOn           = false;     // Skript Logausgabe ein- (true) / ausschalten (false). Fehler werden immer ausgegeben.
              var forceCreation    = false;    // Default: false. true: Datenpunkte werden überschrieben (wenn z.B. Bezeichnungen geändert wurden)
              
              var tibberPricesToday = "tibber.0.priceInfo.today.";        // mit . am Ende!
              var tibberPricesTomorrow = "tibber.0.priceInfo.tomorrow.";  // mit . am Ende!
              
              var tibberStartsAt = "startsAt";
              var tibberTotal = "total";
              
              
              // Datenpunkte anlegen:
              // -----------------------------------------------------------------------------
              var idChartData = "tibber.prices.chartData";                      // Pfad und Name, unter dem in der Javascript-Instanz der Datenpunkte angelegt wird
              createState(idChartData, '[{"label":"15","value":"25.2","dataColor":"#ffffff"},{"label":"16","value":"28.8","dataColor":"#ffffff"},{"label":"17","value":3"5.2","dataColor":"#ffffff"},{"label":"18","value":"33.2","dataColor":"#ffffff"},{"label":"19","value":"20.2","dataColor":"#ffffff"}]', forceCreation, {
                   name: 'Chart-Data Price Forecast',
                   desc: 'Chart-Data Price Forecast',
                   type: 'string',
                   role: 'value'
              });
              
              // Datenpunkte anlegen:
              // -----------------------------------------------------------------------------
              var idBarChartData = "tibber.prices.barChartData";                      // Pfad und Name, unter dem in der Javascript-Instanz der Datenpunkte angelegt wird
              createState(idBarChartData, '[{"label":"15","value":"25.2","dataColor":"#ffffff"},{"label":"16","value":"28.8","dataColor":"#ffffff"},{"label":"17","value":3"5.2","dataColor":"#ffffff"},{"label":"18","value":"33.2","dataColor":"#ffffff"},{"label":"19","value":"20.2","dataColor":"#ffffff"}]', forceCreation, {
                   name: 'Bar Chart-Data Price Forecast',
                   desc: 'Bar Chart-Data Price Forecast',
                   type: 'string',
                   role: 'value'
              });
              
              createBarChartData();
              
              // Cron-Job, zum Stundenwechsel
              // Stundenwechsel, Ausführen immer um *:00:10
              schedule('10 0 * * * *', function () {createBarChartData()});
              
              function createBarChartData () {    
              	if(logOn) console.log(myName + " Stundenwechsel");
                  
                  let barChart = [];
              
                  var jetzt = new Date(Date.now());
                  var aktStunde = jetzt.getHours();
                  var unixTimestamp=new Date().getTime();
              
                  // bis zu 18 Stunden in die Zukunft
                  const offsets=[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18];
              
                  for (let offset of offsets)
                  {
                      // Template Objekt für BarChart erzeugen
                      let itemData ={label:"", value:0.0, dataColor: "#c2c2c2", valueColor: "#dddddd"}; //, valueAppendix: "", valueColor: #ffffff"
              
                      // Vorbereitung um Werte aus Tibber Adapter zu holen         
                      var prefix="";
                      aktStunde=jetzt.getHours()+offset;
                      if (aktStunde>23)
                      {
                          aktStunde=aktStunde-24;
                          prefix=tibberPricesTomorrow;
                      }
                      else
                      {
                          prefix=tibberPricesToday;
                      }
              
                      var strStunde = ("0" + aktStunde.toString()).slice(-2);
                      itemData['label']=strStunde;
              
                      prefix=prefix+strStunde+'.';
              
                      var aktPrice=getState(prefix+tibberTotal).val;
               
                      // falls keine Daten vorliegen, weiter ohne diese ItemData an das Chart-Objekt anzuhängen
                      if (aktPrice==null && aktStunde>=0)
                          continue;
              
                      // von 0.2345 € auf Cent mit einer Nachkomma-Stelle umrechnen
                      itemData['value']=Math.round(aktPrice*1000)/10.0;
              
                      // Je nach Preis den Balken einfärben
                      if (aktPrice<0.30)
                          itemData['dataColor']="green";
                      else
                      if (aktPrice<0.40)
                          itemData['dataColor']="yellow";
                      else
                      if (aktPrice<0.50)
                          itemData['dataColor']="orange";
                      else
                      if (aktPrice<0.60)
                          itemData['dataColor']="red";
                      else
                          itemData['dataColor']="magenta";
              
                      // Daten für diese Stunde dem Objekt zufügen
                      barChart.push(itemData);
                  }
              
                  // fertiges Objekt in den Datenpunkt als JSON schreiben
                  setState("javascript."+instance+"."+idBarChartData, JSON.stringify(barChart), true);
              
              };
              
              function createChartData () {    
              	if(logOn) console.log(myName + " Stundenwechsel");
                  
                  let chart = {};
                  let axisLabels =[];
                  let values =[];
                  let datalabels =[];
              
                  var jetzt = new Date(Date.now());
                  var aktStunde = jetzt.getHours();
                  var unixTimestamp=new Date().getTime();
              
                  const offsets=[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18];
              
                  // Spaltenbeschriftungen
               
                  //chart.graphs[0].axisLables=axisLabels;
                  chart.graphs=new Array();
                  chart.graphs.push({});
                  chart.graphs[0].color="green";
                  chart.graphs[0].type="bar";
                  chart.graphs[0].datalabel_rotation=-90;
                  chart.graphs[0].datalabel_color="lightgreen";
                  chart.graphs[0].datalabel_fontSize=10;
                  chart.graphs[0].yAxis_title_text="cent";
                  chart.graphs[0].yAxis_show=true;
                  chart.graphs[0].legendText="Uhrzeit";
                  chart.graphs[0].datalabel_show=true;
                  chart.graphs[0].yAxis_minimumDigits=1;
                  chart.graphs[0].yAxis_maximumDigits=1;
              
                  for (let offset of offsets)
                  {
                      // Spaltenbeschriftungen
                      aktStunde=jetzt.getHours()+offset;
                      if (aktStunde>23)
                          aktStunde=aktStunde-24;
                      var strStunde = ("0" + aktStunde.toString()).slice(-2);
                      axisLabels.push(strStunde)
                      //axisLabels.push(aktStunde);
                             
                      var prefix="";
                      aktStunde=jetzt.getHours()+offset;
                      if (aktStunde>23)
                      {
                          aktStunde=aktStunde-24;
                          prefix=tibberPricesTomorrow+".";
                      }
                      else
                      {
                          prefix=tibberPricesToday+".";
                      }
              
                      strStunde = ("0" + aktStunde.toString()).slice(-2);
                      prefix=prefix+strStunde+'.';
              
                      //if(logOn) console.log(myName + " Stundenwechsel, akt Stunde "+strStunde+", prefix "+prefix);
                      var aktPrice=getState(prefix+tibberTotal).val;
                      //var aktStartAt=getState(prefix+tibberStartsAt).val;
                      //if(logOn) console.log(myName + " aktPrice "+aktPrice+", aktStartAt "+aktStartAt);
                      //let itemData ={t:0, y:0.0};
                      //itemData['t']=unixTimestamp+3600*offset;
                      //itemData['y']=aktPrice;
                      values.push(Math.round(aktPrice*1000)/10.0);
                      var cents=(Math.round(aktPrice*1000)/10.0).toString();
                      datalabels.push(cents);
              
                  }
                  chart.graphs[0].data=values;
                  chart.graphs[0].datalabel_override=datalabels;
                  chart.data=values;
                  chart.datalabel_override=datalabels;
                  chart.axisLables=axisLabels;
              
                  setState("javascript."+instance+"."+idChartData, JSON.stringify(chart));
              
              };
              

              Christian

              Und hier noch das exportierte Widget

              [{"tpl":"tplVis-materialdesign-Chart-Bar","data":{"oid":"javascript.0.tibber.prices.barChartData","g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","chartDataMethod":"jsonStringObject","dataCount":"0","chartType":"vertical","backgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background","chartAreaBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background_chart","titleLayout":"#mdwTheme:vis-materialdesign.0.fontSizes.card.title","titleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.card.title","colorBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background","colorTitleSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_title","colorTextSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_body","colorTitle":"#mdwTheme:vis-materialdesign.0.colors.card.title","globalColor":"#mdwTheme:vis-materialdesign.0.colors.charts.global","hoverColor":"#mdwTheme:vis-materialdesign.0.colors.charts.bar.hover","hoverBorderColor":"#mdwTheme:vis-materialdesign.0.colors.charts.bar.hover_border","showValues":"showValuesOn","valuesFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.value","valuesFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.value","valuesFontSize":"10","valuesPositionAnchor":"end","valuesPositionAlign":"top","valuesTextAlign":"center","yAxisPosition":"left","yAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_title","yAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_title","yAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_title","yAxisValueLabelColor":"#dddddd","yAxisValueFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_values","yAxisValueFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_values","yAxisValueDistanceToAxis":"10","yAxisShowAxis":"true","yAxisShowAxisLabels":"true","yAxisShowGridLines":"true","yAxisGridLinesColor":"#ffffff","yAxisShowTicks":"true","yAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_zeroline","xAxisPosition":"bottom","xAxisTicksSource":"auto","xAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_title","xAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_title","xAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_title","xAxisValueLabelColor":"#dddddd","xAxisValueFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_values","xAxisValueFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_values","xAxisValueDistanceToAxis":"0","xAxisShowAxis":"true","xAxisShowAxisLabels":"true","xAxisShowGridLines":"true","xAxisGridLinesColor":"#ffffff","xAxisShowTicks":"true","xAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_zeroline","xAxisMinRotation":"0","xAxisMaxRotation":"0","legendPosition":"right","legendFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.legend","legendFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.legend","legendFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.legend","legendPointStyle":"true","showTooltip":"true","tooltipBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_background","tooltipShowColorBox":"true","tooltipTitleFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_title","tooltipTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_title","tooltipTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_title","tooltipBodyFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_text","tooltipBodyFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_text","tooltipBodyFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_text","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"chartPaddingBottom":"1","cardUse":false,"xAxisTitle":"","showLegend":false,"axisValueAppendText":"","axisLabelAutoSkip":false,"g_layoutForData_§0":false,"g_oids":false,"barWidth":"","valuesRotation":"-90","valuesPositionOffset":"","valuesMaxDecimals":"1","valuesMinDecimals":"1"},"style":{"left":"420px","top":"248px","width":"410px","height":"213px"},"widgetSet":"materialdesign"}]
              

              liv-in-skyL M Q 3 Antworten Letzte Antwort
              2
              • F Familienvater

                Moin,

                also mit dem JSON-Chart habe ich es nicht hinbekommen, aber mit dem Bar Chart hat es geklappt, und es ist ausreichend "hübsch":
                2021-10-08_17h59_03.png

                Zu meinem Code und als Entschuldigung: JavaScript ist nicht so meins :-), Kommentare sind immerhin überhaupt welche drin. Und die createChartData - Funktion ist das, was ich vergeblich für das JSON-Chart versucht hatte, vielleicht schleift das noch jemand rund...

                var myName = "tibber.createchartdata";
                
                var logOn           = false;     // Skript Logausgabe ein- (true) / ausschalten (false). Fehler werden immer ausgegeben.
                var forceCreation    = false;    // Default: false. true: Datenpunkte werden überschrieben (wenn z.B. Bezeichnungen geändert wurden)
                
                var tibberPricesToday = "tibber.0.priceInfo.today.";        // mit . am Ende!
                var tibberPricesTomorrow = "tibber.0.priceInfo.tomorrow.";  // mit . am Ende!
                
                var tibberStartsAt = "startsAt";
                var tibberTotal = "total";
                
                
                // Datenpunkte anlegen:
                // -----------------------------------------------------------------------------
                var idChartData = "tibber.prices.chartData";                      // Pfad und Name, unter dem in der Javascript-Instanz der Datenpunkte angelegt wird
                createState(idChartData, '[{"label":"15","value":"25.2","dataColor":"#ffffff"},{"label":"16","value":"28.8","dataColor":"#ffffff"},{"label":"17","value":3"5.2","dataColor":"#ffffff"},{"label":"18","value":"33.2","dataColor":"#ffffff"},{"label":"19","value":"20.2","dataColor":"#ffffff"}]', forceCreation, {
                     name: 'Chart-Data Price Forecast',
                     desc: 'Chart-Data Price Forecast',
                     type: 'string',
                     role: 'value'
                });
                
                // Datenpunkte anlegen:
                // -----------------------------------------------------------------------------
                var idBarChartData = "tibber.prices.barChartData";                      // Pfad und Name, unter dem in der Javascript-Instanz der Datenpunkte angelegt wird
                createState(idBarChartData, '[{"label":"15","value":"25.2","dataColor":"#ffffff"},{"label":"16","value":"28.8","dataColor":"#ffffff"},{"label":"17","value":3"5.2","dataColor":"#ffffff"},{"label":"18","value":"33.2","dataColor":"#ffffff"},{"label":"19","value":"20.2","dataColor":"#ffffff"}]', forceCreation, {
                     name: 'Bar Chart-Data Price Forecast',
                     desc: 'Bar Chart-Data Price Forecast',
                     type: 'string',
                     role: 'value'
                });
                
                createBarChartData();
                
                // Cron-Job, zum Stundenwechsel
                // Stundenwechsel, Ausführen immer um *:00:10
                schedule('10 0 * * * *', function () {createBarChartData()});
                
                function createBarChartData () {    
                	if(logOn) console.log(myName + " Stundenwechsel");
                    
                    let barChart = [];
                
                    var jetzt = new Date(Date.now());
                    var aktStunde = jetzt.getHours();
                    var unixTimestamp=new Date().getTime();
                
                    // bis zu 18 Stunden in die Zukunft
                    const offsets=[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18];
                
                    for (let offset of offsets)
                    {
                        // Template Objekt für BarChart erzeugen
                        let itemData ={label:"", value:0.0, dataColor: "#c2c2c2", valueColor: "#dddddd"}; //, valueAppendix: "", valueColor: #ffffff"
                
                        // Vorbereitung um Werte aus Tibber Adapter zu holen         
                        var prefix="";
                        aktStunde=jetzt.getHours()+offset;
                        if (aktStunde>23)
                        {
                            aktStunde=aktStunde-24;
                            prefix=tibberPricesTomorrow;
                        }
                        else
                        {
                            prefix=tibberPricesToday;
                        }
                
                        var strStunde = ("0" + aktStunde.toString()).slice(-2);
                        itemData['label']=strStunde;
                
                        prefix=prefix+strStunde+'.';
                
                        var aktPrice=getState(prefix+tibberTotal).val;
                 
                        // falls keine Daten vorliegen, weiter ohne diese ItemData an das Chart-Objekt anzuhängen
                        if (aktPrice==null && aktStunde>=0)
                            continue;
                
                        // von 0.2345 € auf Cent mit einer Nachkomma-Stelle umrechnen
                        itemData['value']=Math.round(aktPrice*1000)/10.0;
                
                        // Je nach Preis den Balken einfärben
                        if (aktPrice<0.30)
                            itemData['dataColor']="green";
                        else
                        if (aktPrice<0.40)
                            itemData['dataColor']="yellow";
                        else
                        if (aktPrice<0.50)
                            itemData['dataColor']="orange";
                        else
                        if (aktPrice<0.60)
                            itemData['dataColor']="red";
                        else
                            itemData['dataColor']="magenta";
                
                        // Daten für diese Stunde dem Objekt zufügen
                        barChart.push(itemData);
                    }
                
                    // fertiges Objekt in den Datenpunkt als JSON schreiben
                    setState("javascript."+instance+"."+idBarChartData, JSON.stringify(barChart), true);
                
                };
                
                function createChartData () {    
                	if(logOn) console.log(myName + " Stundenwechsel");
                    
                    let chart = {};
                    let axisLabels =[];
                    let values =[];
                    let datalabels =[];
                
                    var jetzt = new Date(Date.now());
                    var aktStunde = jetzt.getHours();
                    var unixTimestamp=new Date().getTime();
                
                    const offsets=[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18];
                
                    // Spaltenbeschriftungen
                 
                    //chart.graphs[0].axisLables=axisLabels;
                    chart.graphs=new Array();
                    chart.graphs.push({});
                    chart.graphs[0].color="green";
                    chart.graphs[0].type="bar";
                    chart.graphs[0].datalabel_rotation=-90;
                    chart.graphs[0].datalabel_color="lightgreen";
                    chart.graphs[0].datalabel_fontSize=10;
                    chart.graphs[0].yAxis_title_text="cent";
                    chart.graphs[0].yAxis_show=true;
                    chart.graphs[0].legendText="Uhrzeit";
                    chart.graphs[0].datalabel_show=true;
                    chart.graphs[0].yAxis_minimumDigits=1;
                    chart.graphs[0].yAxis_maximumDigits=1;
                
                    for (let offset of offsets)
                    {
                        // Spaltenbeschriftungen
                        aktStunde=jetzt.getHours()+offset;
                        if (aktStunde>23)
                            aktStunde=aktStunde-24;
                        var strStunde = ("0" + aktStunde.toString()).slice(-2);
                        axisLabels.push(strStunde)
                        //axisLabels.push(aktStunde);
                               
                        var prefix="";
                        aktStunde=jetzt.getHours()+offset;
                        if (aktStunde>23)
                        {
                            aktStunde=aktStunde-24;
                            prefix=tibberPricesTomorrow+".";
                        }
                        else
                        {
                            prefix=tibberPricesToday+".";
                        }
                
                        strStunde = ("0" + aktStunde.toString()).slice(-2);
                        prefix=prefix+strStunde+'.';
                
                        //if(logOn) console.log(myName + " Stundenwechsel, akt Stunde "+strStunde+", prefix "+prefix);
                        var aktPrice=getState(prefix+tibberTotal).val;
                        //var aktStartAt=getState(prefix+tibberStartsAt).val;
                        //if(logOn) console.log(myName + " aktPrice "+aktPrice+", aktStartAt "+aktStartAt);
                        //let itemData ={t:0, y:0.0};
                        //itemData['t']=unixTimestamp+3600*offset;
                        //itemData['y']=aktPrice;
                        values.push(Math.round(aktPrice*1000)/10.0);
                        var cents=(Math.round(aktPrice*1000)/10.0).toString();
                        datalabels.push(cents);
                
                    }
                    chart.graphs[0].data=values;
                    chart.graphs[0].datalabel_override=datalabels;
                    chart.data=values;
                    chart.datalabel_override=datalabels;
                    chart.axisLables=axisLabels;
                
                    setState("javascript."+instance+"."+idChartData, JSON.stringify(chart));
                
                };
                

                Christian

                Und hier noch das exportierte Widget

                [{"tpl":"tplVis-materialdesign-Chart-Bar","data":{"oid":"javascript.0.tibber.prices.barChartData","g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","chartDataMethod":"jsonStringObject","dataCount":"0","chartType":"vertical","backgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background","chartAreaBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background_chart","titleLayout":"#mdwTheme:vis-materialdesign.0.fontSizes.card.title","titleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.card.title","colorBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background","colorTitleSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_title","colorTextSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_body","colorTitle":"#mdwTheme:vis-materialdesign.0.colors.card.title","globalColor":"#mdwTheme:vis-materialdesign.0.colors.charts.global","hoverColor":"#mdwTheme:vis-materialdesign.0.colors.charts.bar.hover","hoverBorderColor":"#mdwTheme:vis-materialdesign.0.colors.charts.bar.hover_border","showValues":"showValuesOn","valuesFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.value","valuesFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.value","valuesFontSize":"10","valuesPositionAnchor":"end","valuesPositionAlign":"top","valuesTextAlign":"center","yAxisPosition":"left","yAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_title","yAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_title","yAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_title","yAxisValueLabelColor":"#dddddd","yAxisValueFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_values","yAxisValueFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_values","yAxisValueDistanceToAxis":"10","yAxisShowAxis":"true","yAxisShowAxisLabels":"true","yAxisShowGridLines":"true","yAxisGridLinesColor":"#ffffff","yAxisShowTicks":"true","yAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_zeroline","xAxisPosition":"bottom","xAxisTicksSource":"auto","xAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_title","xAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_title","xAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_title","xAxisValueLabelColor":"#dddddd","xAxisValueFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_values","xAxisValueFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_values","xAxisValueDistanceToAxis":"0","xAxisShowAxis":"true","xAxisShowAxisLabels":"true","xAxisShowGridLines":"true","xAxisGridLinesColor":"#ffffff","xAxisShowTicks":"true","xAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_zeroline","xAxisMinRotation":"0","xAxisMaxRotation":"0","legendPosition":"right","legendFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.legend","legendFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.legend","legendFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.legend","legendPointStyle":"true","showTooltip":"true","tooltipBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_background","tooltipShowColorBox":"true","tooltipTitleFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_title","tooltipTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_title","tooltipTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_title","tooltipBodyFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_text","tooltipBodyFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_text","tooltipBodyFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_text","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"chartPaddingBottom":"1","cardUse":false,"xAxisTitle":"","showLegend":false,"axisValueAppendText":"","axisLabelAutoSkip":false,"g_layoutForData_§0":false,"g_oids":false,"barWidth":"","valuesRotation":"-90","valuesPositionOffset":"","valuesMaxDecimals":"1","valuesMinDecimals":"1"},"style":{"left":"420px","top":"248px","width":"410px","height":"213px"},"widgetSet":"materialdesign"}]
                

                liv-in-skyL Offline
                liv-in-skyL Offline
                liv-in-sky
                schrieb am zuletzt editiert von
                #13

                @familienvater schaut doch gut aus !

                nach einem gelösten Thread wäre es sinnvoll dies in der Überschrift des ersten Posts einzutragen [gelöst]-... Bitte benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat. Forum-Tools: PicPick https://picpick.app/en/download/ und ScreenToGif https://www.screentogif.com/downloads.html

                HomoranH 1 Antwort Letzte Antwort
                0
                • liv-in-skyL liv-in-sky

                  @familienvater schaut doch gut aus !

                  HomoranH Nicht stören
                  HomoranH Nicht stören
                  Homoran
                  Global Moderator Administrators
                  schrieb am zuletzt editiert von
                  #14

                  @liv-in-sky sagte in Diagramm mit festen Werten in VIS - nur wie?:

                  @familienvater schaut doch gut aus !

                  und ist auch ausreichend bunt

                  @Familienvater
                  :+1:

                  kein Support per PN! - Fragen im Forum stellen - es gibt fast nichts, was nicht auch für andere interessant ist.

                  Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                  der Installationsfixer: curl -fsL https://iobroker.net/fix.sh | bash -

                  1 Antwort Letzte Antwort
                  1
                  • F Familienvater

                    Moin,

                    also mit dem JSON-Chart habe ich es nicht hinbekommen, aber mit dem Bar Chart hat es geklappt, und es ist ausreichend "hübsch":
                    2021-10-08_17h59_03.png

                    Zu meinem Code und als Entschuldigung: JavaScript ist nicht so meins :-), Kommentare sind immerhin überhaupt welche drin. Und die createChartData - Funktion ist das, was ich vergeblich für das JSON-Chart versucht hatte, vielleicht schleift das noch jemand rund...

                    var myName = "tibber.createchartdata";
                    
                    var logOn           = false;     // Skript Logausgabe ein- (true) / ausschalten (false). Fehler werden immer ausgegeben.
                    var forceCreation    = false;    // Default: false. true: Datenpunkte werden überschrieben (wenn z.B. Bezeichnungen geändert wurden)
                    
                    var tibberPricesToday = "tibber.0.priceInfo.today.";        // mit . am Ende!
                    var tibberPricesTomorrow = "tibber.0.priceInfo.tomorrow.";  // mit . am Ende!
                    
                    var tibberStartsAt = "startsAt";
                    var tibberTotal = "total";
                    
                    
                    // Datenpunkte anlegen:
                    // -----------------------------------------------------------------------------
                    var idChartData = "tibber.prices.chartData";                      // Pfad und Name, unter dem in der Javascript-Instanz der Datenpunkte angelegt wird
                    createState(idChartData, '[{"label":"15","value":"25.2","dataColor":"#ffffff"},{"label":"16","value":"28.8","dataColor":"#ffffff"},{"label":"17","value":3"5.2","dataColor":"#ffffff"},{"label":"18","value":"33.2","dataColor":"#ffffff"},{"label":"19","value":"20.2","dataColor":"#ffffff"}]', forceCreation, {
                         name: 'Chart-Data Price Forecast',
                         desc: 'Chart-Data Price Forecast',
                         type: 'string',
                         role: 'value'
                    });
                    
                    // Datenpunkte anlegen:
                    // -----------------------------------------------------------------------------
                    var idBarChartData = "tibber.prices.barChartData";                      // Pfad und Name, unter dem in der Javascript-Instanz der Datenpunkte angelegt wird
                    createState(idBarChartData, '[{"label":"15","value":"25.2","dataColor":"#ffffff"},{"label":"16","value":"28.8","dataColor":"#ffffff"},{"label":"17","value":3"5.2","dataColor":"#ffffff"},{"label":"18","value":"33.2","dataColor":"#ffffff"},{"label":"19","value":"20.2","dataColor":"#ffffff"}]', forceCreation, {
                         name: 'Bar Chart-Data Price Forecast',
                         desc: 'Bar Chart-Data Price Forecast',
                         type: 'string',
                         role: 'value'
                    });
                    
                    createBarChartData();
                    
                    // Cron-Job, zum Stundenwechsel
                    // Stundenwechsel, Ausführen immer um *:00:10
                    schedule('10 0 * * * *', function () {createBarChartData()});
                    
                    function createBarChartData () {    
                    	if(logOn) console.log(myName + " Stundenwechsel");
                        
                        let barChart = [];
                    
                        var jetzt = new Date(Date.now());
                        var aktStunde = jetzt.getHours();
                        var unixTimestamp=new Date().getTime();
                    
                        // bis zu 18 Stunden in die Zukunft
                        const offsets=[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18];
                    
                        for (let offset of offsets)
                        {
                            // Template Objekt für BarChart erzeugen
                            let itemData ={label:"", value:0.0, dataColor: "#c2c2c2", valueColor: "#dddddd"}; //, valueAppendix: "", valueColor: #ffffff"
                    
                            // Vorbereitung um Werte aus Tibber Adapter zu holen         
                            var prefix="";
                            aktStunde=jetzt.getHours()+offset;
                            if (aktStunde>23)
                            {
                                aktStunde=aktStunde-24;
                                prefix=tibberPricesTomorrow;
                            }
                            else
                            {
                                prefix=tibberPricesToday;
                            }
                    
                            var strStunde = ("0" + aktStunde.toString()).slice(-2);
                            itemData['label']=strStunde;
                    
                            prefix=prefix+strStunde+'.';
                    
                            var aktPrice=getState(prefix+tibberTotal).val;
                     
                            // falls keine Daten vorliegen, weiter ohne diese ItemData an das Chart-Objekt anzuhängen
                            if (aktPrice==null && aktStunde>=0)
                                continue;
                    
                            // von 0.2345 € auf Cent mit einer Nachkomma-Stelle umrechnen
                            itemData['value']=Math.round(aktPrice*1000)/10.0;
                    
                            // Je nach Preis den Balken einfärben
                            if (aktPrice<0.30)
                                itemData['dataColor']="green";
                            else
                            if (aktPrice<0.40)
                                itemData['dataColor']="yellow";
                            else
                            if (aktPrice<0.50)
                                itemData['dataColor']="orange";
                            else
                            if (aktPrice<0.60)
                                itemData['dataColor']="red";
                            else
                                itemData['dataColor']="magenta";
                    
                            // Daten für diese Stunde dem Objekt zufügen
                            barChart.push(itemData);
                        }
                    
                        // fertiges Objekt in den Datenpunkt als JSON schreiben
                        setState("javascript."+instance+"."+idBarChartData, JSON.stringify(barChart), true);
                    
                    };
                    
                    function createChartData () {    
                    	if(logOn) console.log(myName + " Stundenwechsel");
                        
                        let chart = {};
                        let axisLabels =[];
                        let values =[];
                        let datalabels =[];
                    
                        var jetzt = new Date(Date.now());
                        var aktStunde = jetzt.getHours();
                        var unixTimestamp=new Date().getTime();
                    
                        const offsets=[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18];
                    
                        // Spaltenbeschriftungen
                     
                        //chart.graphs[0].axisLables=axisLabels;
                        chart.graphs=new Array();
                        chart.graphs.push({});
                        chart.graphs[0].color="green";
                        chart.graphs[0].type="bar";
                        chart.graphs[0].datalabel_rotation=-90;
                        chart.graphs[0].datalabel_color="lightgreen";
                        chart.graphs[0].datalabel_fontSize=10;
                        chart.graphs[0].yAxis_title_text="cent";
                        chart.graphs[0].yAxis_show=true;
                        chart.graphs[0].legendText="Uhrzeit";
                        chart.graphs[0].datalabel_show=true;
                        chart.graphs[0].yAxis_minimumDigits=1;
                        chart.graphs[0].yAxis_maximumDigits=1;
                    
                        for (let offset of offsets)
                        {
                            // Spaltenbeschriftungen
                            aktStunde=jetzt.getHours()+offset;
                            if (aktStunde>23)
                                aktStunde=aktStunde-24;
                            var strStunde = ("0" + aktStunde.toString()).slice(-2);
                            axisLabels.push(strStunde)
                            //axisLabels.push(aktStunde);
                                   
                            var prefix="";
                            aktStunde=jetzt.getHours()+offset;
                            if (aktStunde>23)
                            {
                                aktStunde=aktStunde-24;
                                prefix=tibberPricesTomorrow+".";
                            }
                            else
                            {
                                prefix=tibberPricesToday+".";
                            }
                    
                            strStunde = ("0" + aktStunde.toString()).slice(-2);
                            prefix=prefix+strStunde+'.';
                    
                            //if(logOn) console.log(myName + " Stundenwechsel, akt Stunde "+strStunde+", prefix "+prefix);
                            var aktPrice=getState(prefix+tibberTotal).val;
                            //var aktStartAt=getState(prefix+tibberStartsAt).val;
                            //if(logOn) console.log(myName + " aktPrice "+aktPrice+", aktStartAt "+aktStartAt);
                            //let itemData ={t:0, y:0.0};
                            //itemData['t']=unixTimestamp+3600*offset;
                            //itemData['y']=aktPrice;
                            values.push(Math.round(aktPrice*1000)/10.0);
                            var cents=(Math.round(aktPrice*1000)/10.0).toString();
                            datalabels.push(cents);
                    
                        }
                        chart.graphs[0].data=values;
                        chart.graphs[0].datalabel_override=datalabels;
                        chart.data=values;
                        chart.datalabel_override=datalabels;
                        chart.axisLables=axisLabels;
                    
                        setState("javascript."+instance+"."+idChartData, JSON.stringify(chart));
                    
                    };
                    

                    Christian

                    Und hier noch das exportierte Widget

                    [{"tpl":"tplVis-materialdesign-Chart-Bar","data":{"oid":"javascript.0.tibber.prices.barChartData","g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","chartDataMethod":"jsonStringObject","dataCount":"0","chartType":"vertical","backgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background","chartAreaBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background_chart","titleLayout":"#mdwTheme:vis-materialdesign.0.fontSizes.card.title","titleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.card.title","colorBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background","colorTitleSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_title","colorTextSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_body","colorTitle":"#mdwTheme:vis-materialdesign.0.colors.card.title","globalColor":"#mdwTheme:vis-materialdesign.0.colors.charts.global","hoverColor":"#mdwTheme:vis-materialdesign.0.colors.charts.bar.hover","hoverBorderColor":"#mdwTheme:vis-materialdesign.0.colors.charts.bar.hover_border","showValues":"showValuesOn","valuesFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.value","valuesFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.value","valuesFontSize":"10","valuesPositionAnchor":"end","valuesPositionAlign":"top","valuesTextAlign":"center","yAxisPosition":"left","yAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_title","yAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_title","yAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_title","yAxisValueLabelColor":"#dddddd","yAxisValueFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_values","yAxisValueFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_values","yAxisValueDistanceToAxis":"10","yAxisShowAxis":"true","yAxisShowAxisLabels":"true","yAxisShowGridLines":"true","yAxisGridLinesColor":"#ffffff","yAxisShowTicks":"true","yAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_zeroline","xAxisPosition":"bottom","xAxisTicksSource":"auto","xAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_title","xAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_title","xAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_title","xAxisValueLabelColor":"#dddddd","xAxisValueFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_values","xAxisValueFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_values","xAxisValueDistanceToAxis":"0","xAxisShowAxis":"true","xAxisShowAxisLabels":"true","xAxisShowGridLines":"true","xAxisGridLinesColor":"#ffffff","xAxisShowTicks":"true","xAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_zeroline","xAxisMinRotation":"0","xAxisMaxRotation":"0","legendPosition":"right","legendFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.legend","legendFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.legend","legendFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.legend","legendPointStyle":"true","showTooltip":"true","tooltipBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_background","tooltipShowColorBox":"true","tooltipTitleFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_title","tooltipTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_title","tooltipTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_title","tooltipBodyFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_text","tooltipBodyFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_text","tooltipBodyFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_text","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"chartPaddingBottom":"1","cardUse":false,"xAxisTitle":"","showLegend":false,"axisValueAppendText":"","axisLabelAutoSkip":false,"g_layoutForData_§0":false,"g_oids":false,"barWidth":"","valuesRotation":"-90","valuesPositionOffset":"","valuesMaxDecimals":"1","valuesMinDecimals":"1"},"style":{"left":"420px","top":"248px","width":"410px","height":"213px"},"widgetSet":"materialdesign"}]
                    

                    M Offline
                    M Offline
                    Michaelnorge
                    schrieb am zuletzt editiert von
                    #15

                    @familienvater Mensch wie geil!!!!
                    Leider kann ich null Javascript und hab keine Ahnung, wie ich das hier bei mir einbinden kann!!

                    Aber toll gemacht!!!

                    –--------------------------------------------------------------------------------------

                    • Smart mit: Rasp 4B / ioBroker / Conbee2 / Trådfri / Xiaomi / HUE / Logitech Harmony / Aqara / Easee Wallbox / Hyundai Ioniq / Alexa / Google Home / Fully Kiosk / VIS
                    F 1 Antwort Letzte Antwort
                    0
                    • M Michaelnorge

                      @familienvater Mensch wie geil!!!!
                      Leider kann ich null Javascript und hab keine Ahnung, wie ich das hier bei mir einbinden kann!!

                      Aber toll gemacht!!!

                      F Offline
                      F Offline
                      Familienvater
                      schrieb am zuletzt editiert von
                      #16

                      @michaelnorge
                      Hi,

                      OK, etwas mehr Ahnung von JavaScript habe ich dann vielleicht schon, aber die Profis mögen mich/Dich etwas in die richtige Richtung schubsen:
                      Einfach den JavaScript-Adapter installieren, dann bekommt man links ein neues "Icon" für JS Skripte, da erstellt man über das "+" ein neues JS-Script, und da kopiert man den Script-Code rein, kontrolliert ggf. noch mal die Datenpunkte die am Anfang definiert sind, speichert das ganze, und startet dann das Script.
                      Solange Du nur eine Tibber-Instanz hast, und die auf der "0" läuft, sollte eigentlich auch alles passen, und beim ersten Start wird in der Javascript.0-Instanz ein Ordner tibber und darin prices erstellt, und darin liegt dann der barChartData - Datenpunkt, und der wird für das Bar Chart als Datenquelle benutzt.
                      Aber mal ganz ehrlich: Was macht man mit ioBroker ohne Blockly/JavaScript, gerade wenn Du VIS nutzt?
                      Vielleicht kann man das Bar Chart sogar "hart" an die Datenpunkte vom Tibber-Adapter hängen, dann fehlt aber das in "1, 2, 3 usw. Stunden", da geht höchstens um 0 Uhr Heute ist immer der erste Balken, 1 Uhr immer der 2. usw.

                      Und zumindest, wenn man "Irgendwie" öfters, mit egal welcher Programmiersprache zu tun hat, der Einstieg in einfaches JavaScript + ioBroker ist gar nicht so schwer, aber man kann damit das Home wirklich "smarter" machen.

                      Christian

                      M 1 Antwort Letzte Antwort
                      0
                      • F Familienvater

                        @michaelnorge
                        Hi,

                        OK, etwas mehr Ahnung von JavaScript habe ich dann vielleicht schon, aber die Profis mögen mich/Dich etwas in die richtige Richtung schubsen:
                        Einfach den JavaScript-Adapter installieren, dann bekommt man links ein neues "Icon" für JS Skripte, da erstellt man über das "+" ein neues JS-Script, und da kopiert man den Script-Code rein, kontrolliert ggf. noch mal die Datenpunkte die am Anfang definiert sind, speichert das ganze, und startet dann das Script.
                        Solange Du nur eine Tibber-Instanz hast, und die auf der "0" läuft, sollte eigentlich auch alles passen, und beim ersten Start wird in der Javascript.0-Instanz ein Ordner tibber und darin prices erstellt, und darin liegt dann der barChartData - Datenpunkt, und der wird für das Bar Chart als Datenquelle benutzt.
                        Aber mal ganz ehrlich: Was macht man mit ioBroker ohne Blockly/JavaScript, gerade wenn Du VIS nutzt?
                        Vielleicht kann man das Bar Chart sogar "hart" an die Datenpunkte vom Tibber-Adapter hängen, dann fehlt aber das in "1, 2, 3 usw. Stunden", da geht höchstens um 0 Uhr Heute ist immer der erste Balken, 1 Uhr immer der 2. usw.

                        Und zumindest, wenn man "Irgendwie" öfters, mit egal welcher Programmiersprache zu tun hat, der Einstieg in einfaches JavaScript + ioBroker ist gar nicht so schwer, aber man kann damit das Home wirklich "smarter" machen.

                        Christian

                        M Offline
                        M Offline
                        Michaelnorge
                        schrieb am zuletzt editiert von
                        #17

                        @familienvater Kleines Missverständnis: Ich nutze Blockly, ausschließlich Blockly. Seit Jahren! Aber vom eigentlichen Scripten verstehe ich nichts ;-)

                        Ich schau mir Deinen Script mal näher an, sobald es die Zeit zulässt.

                        Super Arbeit!

                        –--------------------------------------------------------------------------------------

                        • Smart mit: Rasp 4B / ioBroker / Conbee2 / Trådfri / Xiaomi / HUE / Logitech Harmony / Aqara / Easee Wallbox / Hyundai Ioniq / Alexa / Google Home / Fully Kiosk / VIS
                        PitP 1 Antwort Letzte Antwort
                        0
                        • T Offline
                          T Offline
                          theGrinch
                          schrieb am zuletzt editiert von
                          #18

                          Script für den neueren tibberconnect Adapter angepasst:

                          Einfach das "home" reinkopieren in Zeile 6+7.

                          var myName = "tibber.createchartdata";
                           
                          var logOn           = false;     // Skript Logausgabe ein- (true) / ausschalten (false). Fehler werden immer ausgegeben.
                          var forceCreation    = false;    // Default: false. true: Datenpunkte werden überschrieben (wenn z.B. Bezeichnungen geändert wurden)
                           
                          var tibberPricesToday = "tibberconnect.0.Homes.*****.PricesToday.";        // mit . am Ende!
                          var tibberPricesTomorrow = "tibberconnect.0.Homes.*****.PricesTomorrow.";  // mit . am Ende!
                           
                          var tibberStartsAt = "startsAt";
                          var tibberTotal = "total";
                           
                           
                          // Datenpunkte anlegen:
                          // -----------------------------------------------------------------------------
                          var idChartData = "tibber.prices.chartData";                      // Pfad und Name, unter dem in der Javascript-Instanz der Datenpunkte angelegt wird
                          createState(idChartData, '[{"label":"15","value":"25.2","dataColor":"#ffffff"},{"label":"16","value":"28.8","dataColor":"#ffffff"},{"label":"17","value":3"5.2","dataColor":"#ffffff"},{"label":"18","value":"33.2","dataColor":"#ffffff"},{"label":"19","value":"20.2","dataColor":"#ffffff"}]', forceCreation, {
                               name: 'Chart-Data Price Forecast',
                               desc: 'Chart-Data Price Forecast',
                               type: 'string',
                               role: 'value'
                          });
                           
                          // Datenpunkte anlegen:
                          // -----------------------------------------------------------------------------
                          var idBarChartData = "tibber.prices.barChartData";                      // Pfad und Name, unter dem in der Javascript-Instanz der Datenpunkte angelegt wird
                          createState(idBarChartData, '[{"label":"15","value":"25.2","dataColor":"#ffffff"},{"label":"16","value":"28.8","dataColor":"#ffffff"},{"label":"17","value":3"5.2","dataColor":"#ffffff"},{"label":"18","value":"33.2","dataColor":"#ffffff"},{"label":"19","value":"20.2","dataColor":"#ffffff"}]', forceCreation, {
                               name: 'Bar Chart-Data Price Forecast',
                               desc: 'Bar Chart-Data Price Forecast',
                               type: 'string',
                               role: 'value'
                          });
                           
                          createBarChartData();
                           
                          // Cron-Job, zum Stundenwechsel
                          // Stundenwechsel, Ausführen immer um *:00:10
                          schedule('10 0 * * * *', function () {createBarChartData()});
                           
                          function createBarChartData () {    
                          	if(logOn) console.log(myName + " Stundenwechsel");
                              
                              let barChart = [];
                           
                              var jetzt = new Date(Date.now());
                              var aktStunde = jetzt.getHours();
                              var unixTimestamp=new Date().getTime();
                           
                              // bis zu 18 Stunden in die Zukunft
                              const offsets=[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18];
                           
                              for (let offset of offsets)
                              {
                                  // Template Objekt für BarChart erzeugen
                                  let itemData ={label:"", value:0.0, dataColor: "#c2c2c2", valueColor: "#dddddd"}; //, valueAppendix: "", valueColor: #ffffff"
                           
                                  // Vorbereitung um Werte aus Tibber Adapter zu holen         
                                  var prefix="";
                                  aktStunde=jetzt.getHours()+offset;
                                  if (aktStunde>23)
                                  {
                                      aktStunde=aktStunde-24;
                                      prefix=tibberPricesTomorrow;
                                  }
                                  else
                                  {
                                      prefix=tibberPricesToday;
                                  }
                           
                                  var strStunde = (aktStunde.toString()).slice(-2); //("0" + aktStunde.toString()).slice(-2);
                                  itemData['label']=strStunde;
                           
                                  prefix=prefix+strStunde+'.';
                           
                                  var aktPrice=getState(prefix+tibberTotal).val;
                           
                                  // falls keine Daten vorliegen, weiter ohne diese ItemData an das Chart-Objekt anzuhängen
                                  if (aktPrice==null && aktStunde>=0)
                                      continue;
                           
                                  // von 0.2345 € auf Cent mit einer Nachkomma-Stelle umrechnen
                                  itemData['value']=Math.round(aktPrice*1000)/10.0;
                           
                                  // Je nach Preis den Balken einfärben
                                  if (aktPrice<0.30)
                                      itemData['dataColor']="green";
                                  else
                                  if (aktPrice<0.40)
                                      itemData['dataColor']="yellow";
                                  else
                                  if (aktPrice<0.50)
                                      itemData['dataColor']="orange";
                                  else
                                  if (aktPrice<0.60)
                                      itemData['dataColor']="red";
                                  else
                                      itemData['dataColor']="magenta";
                           
                                  // Daten für diese Stunde dem Objekt zufügen
                                  barChart.push(itemData);
                              }
                           
                              // fertiges Objekt in den Datenpunkt als JSON schreiben
                              setState("javascript."+instance+"."+idBarChartData, JSON.stringify(barChart), true);
                           
                          };
                           
                          function createChartData () {    
                          	if(logOn) console.log(myName + " Stundenwechsel");
                              
                              let chart = {};
                              let axisLabels =[];
                              let values =[];
                              let datalabels =[];
                           
                              var jetzt = new Date(Date.now());
                              var aktStunde = jetzt.getHours();
                              var unixTimestamp=new Date().getTime();
                           
                              const offsets=[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18];
                           
                              // Spaltenbeschriftungen
                           
                              //chart.graphs[0].axisLables=axisLabels;
                              chart.graphs=new Array();
                              chart.graphs.push({});
                              chart.graphs[0].color="green";
                              chart.graphs[0].type="bar";
                              chart.graphs[0].datalabel_rotation=-90;
                              chart.graphs[0].datalabel_color="lightgreen";
                              chart.graphs[0].datalabel_fontSize=10;
                              chart.graphs[0].yAxis_title_text="cent";
                              chart.graphs[0].yAxis_show=true;
                              chart.graphs[0].legendText="Uhrzeit";
                              chart.graphs[0].datalabel_show=true;
                              chart.graphs[0].yAxis_minimumDigits=1;
                              chart.graphs[0].yAxis_maximumDigits=1;
                           
                              for (let offset of offsets)
                              {
                                  // Spaltenbeschriftungen
                                  aktStunde=jetzt.getHours()+offset;
                                  if (aktStunde>23)
                                      aktStunde=aktStunde-24;
                                  var strStunde = (aktStunde.toString()).slice(-2); //("0" + aktStunde.toString()).slice(-2);
                                  axisLabels.push(strStunde)
                                  //axisLabels.push(aktStunde);
                                         
                                  var prefix="";
                                  aktStunde=jetzt.getHours()+offset;
                                  if (aktStunde>23)
                                  {
                                      aktStunde=aktStunde-24;
                                      prefix=tibberPricesTomorrow+".";
                                  }
                                  else
                                  {
                                      prefix=tibberPricesToday+".";
                                  }
                           
                                  strStunde = ("0" + aktStunde.toString()).slice(-2);
                                  prefix=prefix+strStunde+'.';
                           
                                  //if(logOn) console.log(myName + " Stundenwechsel, akt Stunde "+strStunde+", prefix "+prefix);
                                  var aktPrice=getState(prefix+tibberTotal).val;
                                  //var aktStartAt=getState(prefix+tibberStartsAt).val;
                                  //if(logOn) console.log(myName + " aktPrice "+aktPrice+", aktStartAt "+aktStartAt);
                                  //let itemData ={t:0, y:0.0};
                                  //itemData['t']=unixTimestamp+3600*offset;
                                  //itemData['y']=aktPrice;
                                  values.push(Math.round(aktPrice*1000)/10.0);
                                  var cents=(Math.round(aktPrice*1000)/10.0).toString();
                                  datalabels.push(cents);
                           
                              }
                              chart.graphs[0].data=values;
                              chart.graphs[0].datalabel_override=datalabels;
                              chart.data=values;
                              chart.datalabel_override=datalabels;
                              chart.axisLables=axisLabels;
                           
                              setState("javascript."+instance+"."+idChartData, JSON.stringify(chart));
                           
                          };
                          

                          vowillV 1 Antwort Letzte Antwort
                          0
                          • T theGrinch

                            Script für den neueren tibberconnect Adapter angepasst:

                            Einfach das "home" reinkopieren in Zeile 6+7.

                            var myName = "tibber.createchartdata";
                             
                            var logOn           = false;     // Skript Logausgabe ein- (true) / ausschalten (false). Fehler werden immer ausgegeben.
                            var forceCreation    = false;    // Default: false. true: Datenpunkte werden überschrieben (wenn z.B. Bezeichnungen geändert wurden)
                             
                            var tibberPricesToday = "tibberconnect.0.Homes.*****.PricesToday.";        // mit . am Ende!
                            var tibberPricesTomorrow = "tibberconnect.0.Homes.*****.PricesTomorrow.";  // mit . am Ende!
                             
                            var tibberStartsAt = "startsAt";
                            var tibberTotal = "total";
                             
                             
                            // Datenpunkte anlegen:
                            // -----------------------------------------------------------------------------
                            var idChartData = "tibber.prices.chartData";                      // Pfad und Name, unter dem in der Javascript-Instanz der Datenpunkte angelegt wird
                            createState(idChartData, '[{"label":"15","value":"25.2","dataColor":"#ffffff"},{"label":"16","value":"28.8","dataColor":"#ffffff"},{"label":"17","value":3"5.2","dataColor":"#ffffff"},{"label":"18","value":"33.2","dataColor":"#ffffff"},{"label":"19","value":"20.2","dataColor":"#ffffff"}]', forceCreation, {
                                 name: 'Chart-Data Price Forecast',
                                 desc: 'Chart-Data Price Forecast',
                                 type: 'string',
                                 role: 'value'
                            });
                             
                            // Datenpunkte anlegen:
                            // -----------------------------------------------------------------------------
                            var idBarChartData = "tibber.prices.barChartData";                      // Pfad und Name, unter dem in der Javascript-Instanz der Datenpunkte angelegt wird
                            createState(idBarChartData, '[{"label":"15","value":"25.2","dataColor":"#ffffff"},{"label":"16","value":"28.8","dataColor":"#ffffff"},{"label":"17","value":3"5.2","dataColor":"#ffffff"},{"label":"18","value":"33.2","dataColor":"#ffffff"},{"label":"19","value":"20.2","dataColor":"#ffffff"}]', forceCreation, {
                                 name: 'Bar Chart-Data Price Forecast',
                                 desc: 'Bar Chart-Data Price Forecast',
                                 type: 'string',
                                 role: 'value'
                            });
                             
                            createBarChartData();
                             
                            // Cron-Job, zum Stundenwechsel
                            // Stundenwechsel, Ausführen immer um *:00:10
                            schedule('10 0 * * * *', function () {createBarChartData()});
                             
                            function createBarChartData () {    
                            	if(logOn) console.log(myName + " Stundenwechsel");
                                
                                let barChart = [];
                             
                                var jetzt = new Date(Date.now());
                                var aktStunde = jetzt.getHours();
                                var unixTimestamp=new Date().getTime();
                             
                                // bis zu 18 Stunden in die Zukunft
                                const offsets=[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18];
                             
                                for (let offset of offsets)
                                {
                                    // Template Objekt für BarChart erzeugen
                                    let itemData ={label:"", value:0.0, dataColor: "#c2c2c2", valueColor: "#dddddd"}; //, valueAppendix: "", valueColor: #ffffff"
                             
                                    // Vorbereitung um Werte aus Tibber Adapter zu holen         
                                    var prefix="";
                                    aktStunde=jetzt.getHours()+offset;
                                    if (aktStunde>23)
                                    {
                                        aktStunde=aktStunde-24;
                                        prefix=tibberPricesTomorrow;
                                    }
                                    else
                                    {
                                        prefix=tibberPricesToday;
                                    }
                             
                                    var strStunde = (aktStunde.toString()).slice(-2); //("0" + aktStunde.toString()).slice(-2);
                                    itemData['label']=strStunde;
                             
                                    prefix=prefix+strStunde+'.';
                             
                                    var aktPrice=getState(prefix+tibberTotal).val;
                             
                                    // falls keine Daten vorliegen, weiter ohne diese ItemData an das Chart-Objekt anzuhängen
                                    if (aktPrice==null && aktStunde>=0)
                                        continue;
                             
                                    // von 0.2345 € auf Cent mit einer Nachkomma-Stelle umrechnen
                                    itemData['value']=Math.round(aktPrice*1000)/10.0;
                             
                                    // Je nach Preis den Balken einfärben
                                    if (aktPrice<0.30)
                                        itemData['dataColor']="green";
                                    else
                                    if (aktPrice<0.40)
                                        itemData['dataColor']="yellow";
                                    else
                                    if (aktPrice<0.50)
                                        itemData['dataColor']="orange";
                                    else
                                    if (aktPrice<0.60)
                                        itemData['dataColor']="red";
                                    else
                                        itemData['dataColor']="magenta";
                             
                                    // Daten für diese Stunde dem Objekt zufügen
                                    barChart.push(itemData);
                                }
                             
                                // fertiges Objekt in den Datenpunkt als JSON schreiben
                                setState("javascript."+instance+"."+idBarChartData, JSON.stringify(barChart), true);
                             
                            };
                             
                            function createChartData () {    
                            	if(logOn) console.log(myName + " Stundenwechsel");
                                
                                let chart = {};
                                let axisLabels =[];
                                let values =[];
                                let datalabels =[];
                             
                                var jetzt = new Date(Date.now());
                                var aktStunde = jetzt.getHours();
                                var unixTimestamp=new Date().getTime();
                             
                                const offsets=[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18];
                             
                                // Spaltenbeschriftungen
                             
                                //chart.graphs[0].axisLables=axisLabels;
                                chart.graphs=new Array();
                                chart.graphs.push({});
                                chart.graphs[0].color="green";
                                chart.graphs[0].type="bar";
                                chart.graphs[0].datalabel_rotation=-90;
                                chart.graphs[0].datalabel_color="lightgreen";
                                chart.graphs[0].datalabel_fontSize=10;
                                chart.graphs[0].yAxis_title_text="cent";
                                chart.graphs[0].yAxis_show=true;
                                chart.graphs[0].legendText="Uhrzeit";
                                chart.graphs[0].datalabel_show=true;
                                chart.graphs[0].yAxis_minimumDigits=1;
                                chart.graphs[0].yAxis_maximumDigits=1;
                             
                                for (let offset of offsets)
                                {
                                    // Spaltenbeschriftungen
                                    aktStunde=jetzt.getHours()+offset;
                                    if (aktStunde>23)
                                        aktStunde=aktStunde-24;
                                    var strStunde = (aktStunde.toString()).slice(-2); //("0" + aktStunde.toString()).slice(-2);
                                    axisLabels.push(strStunde)
                                    //axisLabels.push(aktStunde);
                                           
                                    var prefix="";
                                    aktStunde=jetzt.getHours()+offset;
                                    if (aktStunde>23)
                                    {
                                        aktStunde=aktStunde-24;
                                        prefix=tibberPricesTomorrow+".";
                                    }
                                    else
                                    {
                                        prefix=tibberPricesToday+".";
                                    }
                             
                                    strStunde = ("0" + aktStunde.toString()).slice(-2);
                                    prefix=prefix+strStunde+'.';
                             
                                    //if(logOn) console.log(myName + " Stundenwechsel, akt Stunde "+strStunde+", prefix "+prefix);
                                    var aktPrice=getState(prefix+tibberTotal).val;
                                    //var aktStartAt=getState(prefix+tibberStartsAt).val;
                                    //if(logOn) console.log(myName + " aktPrice "+aktPrice+", aktStartAt "+aktStartAt);
                                    //let itemData ={t:0, y:0.0};
                                    //itemData['t']=unixTimestamp+3600*offset;
                                    //itemData['y']=aktPrice;
                                    values.push(Math.round(aktPrice*1000)/10.0);
                                    var cents=(Math.round(aktPrice*1000)/10.0).toString();
                                    datalabels.push(cents);
                             
                                }
                                chart.graphs[0].data=values;
                                chart.graphs[0].datalabel_override=datalabels;
                                chart.data=values;
                                chart.datalabel_override=datalabels;
                                chart.axisLables=axisLabels;
                             
                                setState("javascript."+instance+"."+idChartData, JSON.stringify(chart));
                             
                            };
                            

                            vowillV Offline
                            vowillV Offline
                            vowill
                            schrieb am zuletzt editiert von vowill
                            #19

                            Für alle, die den ECharts-Adapter bereits am Laufen haben, hier eine Blockly-Lösung für die grafische Darstellung der Preise heute und Preise Morgen:
                            Nachtrag 25.12.2023: Hier ein Foto des zugehörigen Pop-up-Views in vis:

                            20231225 Tibber-Ansicht.jpg

                            • Der Tibber-Adapter legt seine Daten im Objektbaum unter ‚tibberlink.0.Homes.xxx.PricesToday‘ und ‚tibberlink.0.Homes.83xx.PricesTomorrow‘ ab. Dort gibt es jeweils einen JSON-Datenpunkt, in dem die Werte für den ganzen Tag gespeichert sind.

                            • Der ECharts-Adapter kann optional einen JSON-Datenpunkt einlesen und darstellen, wenn die Daten im Format
                              [{„ts“: 1675887847000, „val“: 45}, {„ts“: 1675887848000, „val“: 77}, {„ts“: 1675887849000, „val“: 180} ]
                              vorliegen (siehe https://github.com/ioBroker/ioBroker.echarts#readme).

                            Damit benötigt es ein Skript, das die beiden JSON-Datenpunkte aus Tibber in einen JSON-Datenpunkt für ECharts konvertiert.
                            Hier eine schnelle Skript-Lösung (mit Ablage des Ergebnisses im String-Datenpunkt ‚0_userdata.0.Stromversorgung.Tibber-Preise‘; der Wert 83xx im Skript ist vor dem Import durch die jeweilige Tibber-ID zu ersetzen):
                            [Nachtrag 01.12.2023: Das zugrunde liegende Blockly-Script konnte ich aufgrund seiner Größe hier nicht hochladen; ich stelle es auf Nachfrage aber gerne per Mail zur Verfügung. Im nachfolgenden Skript (hier das (Update vom 07.12.2024) wird noch zusätzlich der Datenpunkt ‚0_userdata.0.Stromversorgung.Tibber-Mittelwerte‘ befüllt, um im Chart auch Linien für die jeweiligen Tages-Mittelwerte einzublenden.
                            Im EChart muss dann lediglich als Quelle 'JSON' und ID '0_userdata.0.Stromversorgung.Tibber-Preise' angegeben werden; als Diagramm-Typ sollte 'Schritte' gewählt werden.]

                            Update 03.11.2025: Da Tibber die Daten auf einen 15-Minuten-Takt geändert hat, ändert sich auch das Skript. Update siehe weiter unten ab
                            Post #58.

                            ioBroker im lxc auf NUC / Aktive Instanzen: 38

                            AllElectrifiedA L I M B 6 Antworten Letzte Antwort
                            0
                            • F Familienvater

                              Moin,

                              also mit dem JSON-Chart habe ich es nicht hinbekommen, aber mit dem Bar Chart hat es geklappt, und es ist ausreichend "hübsch":
                              2021-10-08_17h59_03.png

                              Zu meinem Code und als Entschuldigung: JavaScript ist nicht so meins :-), Kommentare sind immerhin überhaupt welche drin. Und die createChartData - Funktion ist das, was ich vergeblich für das JSON-Chart versucht hatte, vielleicht schleift das noch jemand rund...

                              var myName = "tibber.createchartdata";
                              
                              var logOn           = false;     // Skript Logausgabe ein- (true) / ausschalten (false). Fehler werden immer ausgegeben.
                              var forceCreation    = false;    // Default: false. true: Datenpunkte werden überschrieben (wenn z.B. Bezeichnungen geändert wurden)
                              
                              var tibberPricesToday = "tibber.0.priceInfo.today.";        // mit . am Ende!
                              var tibberPricesTomorrow = "tibber.0.priceInfo.tomorrow.";  // mit . am Ende!
                              
                              var tibberStartsAt = "startsAt";
                              var tibberTotal = "total";
                              
                              
                              // Datenpunkte anlegen:
                              // -----------------------------------------------------------------------------
                              var idChartData = "tibber.prices.chartData";                      // Pfad und Name, unter dem in der Javascript-Instanz der Datenpunkte angelegt wird
                              createState(idChartData, '[{"label":"15","value":"25.2","dataColor":"#ffffff"},{"label":"16","value":"28.8","dataColor":"#ffffff"},{"label":"17","value":3"5.2","dataColor":"#ffffff"},{"label":"18","value":"33.2","dataColor":"#ffffff"},{"label":"19","value":"20.2","dataColor":"#ffffff"}]', forceCreation, {
                                   name: 'Chart-Data Price Forecast',
                                   desc: 'Chart-Data Price Forecast',
                                   type: 'string',
                                   role: 'value'
                              });
                              
                              // Datenpunkte anlegen:
                              // -----------------------------------------------------------------------------
                              var idBarChartData = "tibber.prices.barChartData";                      // Pfad und Name, unter dem in der Javascript-Instanz der Datenpunkte angelegt wird
                              createState(idBarChartData, '[{"label":"15","value":"25.2","dataColor":"#ffffff"},{"label":"16","value":"28.8","dataColor":"#ffffff"},{"label":"17","value":3"5.2","dataColor":"#ffffff"},{"label":"18","value":"33.2","dataColor":"#ffffff"},{"label":"19","value":"20.2","dataColor":"#ffffff"}]', forceCreation, {
                                   name: 'Bar Chart-Data Price Forecast',
                                   desc: 'Bar Chart-Data Price Forecast',
                                   type: 'string',
                                   role: 'value'
                              });
                              
                              createBarChartData();
                              
                              // Cron-Job, zum Stundenwechsel
                              // Stundenwechsel, Ausführen immer um *:00:10
                              schedule('10 0 * * * *', function () {createBarChartData()});
                              
                              function createBarChartData () {    
                              	if(logOn) console.log(myName + " Stundenwechsel");
                                  
                                  let barChart = [];
                              
                                  var jetzt = new Date(Date.now());
                                  var aktStunde = jetzt.getHours();
                                  var unixTimestamp=new Date().getTime();
                              
                                  // bis zu 18 Stunden in die Zukunft
                                  const offsets=[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18];
                              
                                  for (let offset of offsets)
                                  {
                                      // Template Objekt für BarChart erzeugen
                                      let itemData ={label:"", value:0.0, dataColor: "#c2c2c2", valueColor: "#dddddd"}; //, valueAppendix: "", valueColor: #ffffff"
                              
                                      // Vorbereitung um Werte aus Tibber Adapter zu holen         
                                      var prefix="";
                                      aktStunde=jetzt.getHours()+offset;
                                      if (aktStunde>23)
                                      {
                                          aktStunde=aktStunde-24;
                                          prefix=tibberPricesTomorrow;
                                      }
                                      else
                                      {
                                          prefix=tibberPricesToday;
                                      }
                              
                                      var strStunde = ("0" + aktStunde.toString()).slice(-2);
                                      itemData['label']=strStunde;
                              
                                      prefix=prefix+strStunde+'.';
                              
                                      var aktPrice=getState(prefix+tibberTotal).val;
                               
                                      // falls keine Daten vorliegen, weiter ohne diese ItemData an das Chart-Objekt anzuhängen
                                      if (aktPrice==null && aktStunde>=0)
                                          continue;
                              
                                      // von 0.2345 € auf Cent mit einer Nachkomma-Stelle umrechnen
                                      itemData['value']=Math.round(aktPrice*1000)/10.0;
                              
                                      // Je nach Preis den Balken einfärben
                                      if (aktPrice<0.30)
                                          itemData['dataColor']="green";
                                      else
                                      if (aktPrice<0.40)
                                          itemData['dataColor']="yellow";
                                      else
                                      if (aktPrice<0.50)
                                          itemData['dataColor']="orange";
                                      else
                                      if (aktPrice<0.60)
                                          itemData['dataColor']="red";
                                      else
                                          itemData['dataColor']="magenta";
                              
                                      // Daten für diese Stunde dem Objekt zufügen
                                      barChart.push(itemData);
                                  }
                              
                                  // fertiges Objekt in den Datenpunkt als JSON schreiben
                                  setState("javascript."+instance+"."+idBarChartData, JSON.stringify(barChart), true);
                              
                              };
                              
                              function createChartData () {    
                              	if(logOn) console.log(myName + " Stundenwechsel");
                                  
                                  let chart = {};
                                  let axisLabels =[];
                                  let values =[];
                                  let datalabels =[];
                              
                                  var jetzt = new Date(Date.now());
                                  var aktStunde = jetzt.getHours();
                                  var unixTimestamp=new Date().getTime();
                              
                                  const offsets=[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 13, 14, 15, 16, 17, 18];
                              
                                  // Spaltenbeschriftungen
                               
                                  //chart.graphs[0].axisLables=axisLabels;
                                  chart.graphs=new Array();
                                  chart.graphs.push({});
                                  chart.graphs[0].color="green";
                                  chart.graphs[0].type="bar";
                                  chart.graphs[0].datalabel_rotation=-90;
                                  chart.graphs[0].datalabel_color="lightgreen";
                                  chart.graphs[0].datalabel_fontSize=10;
                                  chart.graphs[0].yAxis_title_text="cent";
                                  chart.graphs[0].yAxis_show=true;
                                  chart.graphs[0].legendText="Uhrzeit";
                                  chart.graphs[0].datalabel_show=true;
                                  chart.graphs[0].yAxis_minimumDigits=1;
                                  chart.graphs[0].yAxis_maximumDigits=1;
                              
                                  for (let offset of offsets)
                                  {
                                      // Spaltenbeschriftungen
                                      aktStunde=jetzt.getHours()+offset;
                                      if (aktStunde>23)
                                          aktStunde=aktStunde-24;
                                      var strStunde = ("0" + aktStunde.toString()).slice(-2);
                                      axisLabels.push(strStunde)
                                      //axisLabels.push(aktStunde);
                                             
                                      var prefix="";
                                      aktStunde=jetzt.getHours()+offset;
                                      if (aktStunde>23)
                                      {
                                          aktStunde=aktStunde-24;
                                          prefix=tibberPricesTomorrow+".";
                                      }
                                      else
                                      {
                                          prefix=tibberPricesToday+".";
                                      }
                              
                                      strStunde = ("0" + aktStunde.toString()).slice(-2);
                                      prefix=prefix+strStunde+'.';
                              
                                      //if(logOn) console.log(myName + " Stundenwechsel, akt Stunde "+strStunde+", prefix "+prefix);
                                      var aktPrice=getState(prefix+tibberTotal).val;
                                      //var aktStartAt=getState(prefix+tibberStartsAt).val;
                                      //if(logOn) console.log(myName + " aktPrice "+aktPrice+", aktStartAt "+aktStartAt);
                                      //let itemData ={t:0, y:0.0};
                                      //itemData['t']=unixTimestamp+3600*offset;
                                      //itemData['y']=aktPrice;
                                      values.push(Math.round(aktPrice*1000)/10.0);
                                      var cents=(Math.round(aktPrice*1000)/10.0).toString();
                                      datalabels.push(cents);
                              
                                  }
                                  chart.graphs[0].data=values;
                                  chart.graphs[0].datalabel_override=datalabels;
                                  chart.data=values;
                                  chart.datalabel_override=datalabels;
                                  chart.axisLables=axisLabels;
                              
                                  setState("javascript."+instance+"."+idChartData, JSON.stringify(chart));
                              
                              };
                              

                              Christian

                              Und hier noch das exportierte Widget

                              [{"tpl":"tplVis-materialdesign-Chart-Bar","data":{"oid":"javascript.0.tibber.prices.barChartData","g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","chartDataMethod":"jsonStringObject","dataCount":"0","chartType":"vertical","backgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background","chartAreaBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background_chart","titleLayout":"#mdwTheme:vis-materialdesign.0.fontSizes.card.title","titleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.card.title","colorBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background","colorTitleSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_title","colorTextSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_body","colorTitle":"#mdwTheme:vis-materialdesign.0.colors.card.title","globalColor":"#mdwTheme:vis-materialdesign.0.colors.charts.global","hoverColor":"#mdwTheme:vis-materialdesign.0.colors.charts.bar.hover","hoverBorderColor":"#mdwTheme:vis-materialdesign.0.colors.charts.bar.hover_border","showValues":"showValuesOn","valuesFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.value","valuesFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.value","valuesFontSize":"10","valuesPositionAnchor":"end","valuesPositionAlign":"top","valuesTextAlign":"center","yAxisPosition":"left","yAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_title","yAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_title","yAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_title","yAxisValueLabelColor":"#dddddd","yAxisValueFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_values","yAxisValueFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_values","yAxisValueDistanceToAxis":"10","yAxisShowAxis":"true","yAxisShowAxisLabels":"true","yAxisShowGridLines":"true","yAxisGridLinesColor":"#ffffff","yAxisShowTicks":"true","yAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_zeroline","xAxisPosition":"bottom","xAxisTicksSource":"auto","xAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_title","xAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_title","xAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_title","xAxisValueLabelColor":"#dddddd","xAxisValueFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_values","xAxisValueFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_values","xAxisValueDistanceToAxis":"0","xAxisShowAxis":"true","xAxisShowAxisLabels":"true","xAxisShowGridLines":"true","xAxisGridLinesColor":"#ffffff","xAxisShowTicks":"true","xAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_zeroline","xAxisMinRotation":"0","xAxisMaxRotation":"0","legendPosition":"right","legendFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.legend","legendFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.legend","legendFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.legend","legendPointStyle":"true","showTooltip":"true","tooltipBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_background","tooltipShowColorBox":"true","tooltipTitleFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_title","tooltipTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_title","tooltipTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_title","tooltipBodyFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_text","tooltipBodyFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_text","tooltipBodyFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_text","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"chartPaddingBottom":"1","cardUse":false,"xAxisTitle":"","showLegend":false,"axisValueAppendText":"","axisLabelAutoSkip":false,"g_layoutForData_§0":false,"g_oids":false,"barWidth":"","valuesRotation":"-90","valuesPositionOffset":"","valuesMaxDecimals":"1","valuesMinDecimals":"1"},"style":{"left":"420px","top":"248px","width":"410px","height":"213px"},"widgetSet":"materialdesign"}]
                              

                              Q Offline
                              Q Offline
                              qwertz
                              schrieb am zuletzt editiert von
                              #20

                              @familienvater
                              Danke dir für das Skript und Widget ! Nutze das mit dem euen Tibberlink Adapter.

                              Klappt Prima. Ich musste nur bei Zeile 144 das "0" + entfernen, damit auch die einstelligen Stunden ausgelesen werden.

                              1 Antwort Letzte Antwort
                              0
                              • vowillV vowill

                                Für alle, die den ECharts-Adapter bereits am Laufen haben, hier eine Blockly-Lösung für die grafische Darstellung der Preise heute und Preise Morgen:
                                Nachtrag 25.12.2023: Hier ein Foto des zugehörigen Pop-up-Views in vis:

                                20231225 Tibber-Ansicht.jpg

                                • Der Tibber-Adapter legt seine Daten im Objektbaum unter ‚tibberlink.0.Homes.xxx.PricesToday‘ und ‚tibberlink.0.Homes.83xx.PricesTomorrow‘ ab. Dort gibt es jeweils einen JSON-Datenpunkt, in dem die Werte für den ganzen Tag gespeichert sind.

                                • Der ECharts-Adapter kann optional einen JSON-Datenpunkt einlesen und darstellen, wenn die Daten im Format
                                  [{„ts“: 1675887847000, „val“: 45}, {„ts“: 1675887848000, „val“: 77}, {„ts“: 1675887849000, „val“: 180} ]
                                  vorliegen (siehe https://github.com/ioBroker/ioBroker.echarts#readme).

                                Damit benötigt es ein Skript, das die beiden JSON-Datenpunkte aus Tibber in einen JSON-Datenpunkt für ECharts konvertiert.
                                Hier eine schnelle Skript-Lösung (mit Ablage des Ergebnisses im String-Datenpunkt ‚0_userdata.0.Stromversorgung.Tibber-Preise‘; der Wert 83xx im Skript ist vor dem Import durch die jeweilige Tibber-ID zu ersetzen):
                                [Nachtrag 01.12.2023: Das zugrunde liegende Blockly-Script konnte ich aufgrund seiner Größe hier nicht hochladen; ich stelle es auf Nachfrage aber gerne per Mail zur Verfügung. Im nachfolgenden Skript (hier das (Update vom 07.12.2024) wird noch zusätzlich der Datenpunkt ‚0_userdata.0.Stromversorgung.Tibber-Mittelwerte‘ befüllt, um im Chart auch Linien für die jeweiligen Tages-Mittelwerte einzublenden.
                                Im EChart muss dann lediglich als Quelle 'JSON' und ID '0_userdata.0.Stromversorgung.Tibber-Preise' angegeben werden; als Diagramm-Typ sollte 'Schritte' gewählt werden.]

                                Update 03.11.2025: Da Tibber die Daten auf einen 15-Minuten-Takt geändert hat, ändert sich auch das Skript. Update siehe weiter unten ab
                                Post #58.

                                AllElectrifiedA Offline
                                AllElectrifiedA Offline
                                AllElectrified
                                schrieb am zuletzt editiert von AllElectrified
                                #21

                                @vowill Danke für die tolle Anregung. Habe das in Blockly umgesetzt. Errechne mir zusätzlich noch bezogen auf einen definierten "Triggerpreis" ein JSON das alle Stunden unterhalb des Preises mit 1 und oberhalb mit 0 enthält und überlagere das im eChart. Dann kann man dynamisch im VIS den Triggerpreis über Tasten einstellen (Triggerpreiswert als Markierung im eChart überlagert) und sieht graphisch (grün), in welchen Stunden der Preis unterhalb des Triggers liegt und ein Zähler zeigt wieviel Stunden das insgesamt sind. Jetzt noch ein kleiner Script der in diesen Stunden die Wallbox aktiviert (nutze dafür dass "best price" feature von Tibberlink). Und fertig :blush:

                                Sieht bei mir im VIS dann so aus:
                                Zwischenablage02.jpg

                                IOBROKER auf MINISFORUM TH50 unter UBUNTU 22.04LTS, etwa 50 Instanzen u.a. Homematic, Broadlink, Shelly, MQTT (openWB), Modbus (Victron), Sonoff, FHEM, Tronity, Homepilot, Hue, RCT, Tibber, Midea, Alexa, Worx, Weatherflow, SourceAnalytix, VIS, eCharts, Flot uvm,..

                                1 Antwort Letzte Antwort
                                1
                                • vowillV vowill

                                  Für alle, die den ECharts-Adapter bereits am Laufen haben, hier eine Blockly-Lösung für die grafische Darstellung der Preise heute und Preise Morgen:
                                  Nachtrag 25.12.2023: Hier ein Foto des zugehörigen Pop-up-Views in vis:

                                  20231225 Tibber-Ansicht.jpg

                                  • Der Tibber-Adapter legt seine Daten im Objektbaum unter ‚tibberlink.0.Homes.xxx.PricesToday‘ und ‚tibberlink.0.Homes.83xx.PricesTomorrow‘ ab. Dort gibt es jeweils einen JSON-Datenpunkt, in dem die Werte für den ganzen Tag gespeichert sind.

                                  • Der ECharts-Adapter kann optional einen JSON-Datenpunkt einlesen und darstellen, wenn die Daten im Format
                                    [{„ts“: 1675887847000, „val“: 45}, {„ts“: 1675887848000, „val“: 77}, {„ts“: 1675887849000, „val“: 180} ]
                                    vorliegen (siehe https://github.com/ioBroker/ioBroker.echarts#readme).

                                  Damit benötigt es ein Skript, das die beiden JSON-Datenpunkte aus Tibber in einen JSON-Datenpunkt für ECharts konvertiert.
                                  Hier eine schnelle Skript-Lösung (mit Ablage des Ergebnisses im String-Datenpunkt ‚0_userdata.0.Stromversorgung.Tibber-Preise‘; der Wert 83xx im Skript ist vor dem Import durch die jeweilige Tibber-ID zu ersetzen):
                                  [Nachtrag 01.12.2023: Das zugrunde liegende Blockly-Script konnte ich aufgrund seiner Größe hier nicht hochladen; ich stelle es auf Nachfrage aber gerne per Mail zur Verfügung. Im nachfolgenden Skript (hier das (Update vom 07.12.2024) wird noch zusätzlich der Datenpunkt ‚0_userdata.0.Stromversorgung.Tibber-Mittelwerte‘ befüllt, um im Chart auch Linien für die jeweiligen Tages-Mittelwerte einzublenden.
                                  Im EChart muss dann lediglich als Quelle 'JSON' und ID '0_userdata.0.Stromversorgung.Tibber-Preise' angegeben werden; als Diagramm-Typ sollte 'Schritte' gewählt werden.]

                                  Update 03.11.2025: Da Tibber die Daten auf einen 15-Minuten-Takt geändert hat, ändert sich auch das Skript. Update siehe weiter unten ab
                                  Post #58.

                                  L Offline
                                  L Offline
                                  lui1307
                                  schrieb am zuletzt editiert von
                                  #22

                                  @vowill Kannst Du mir bitte das zugrunde liegende Blockly-Script per Mail zusenden.

                                  vowillV 1 Antwort Letzte Antwort
                                  0
                                  • L lui1307

                                    @vowill Kannst Du mir bitte das zugrunde liegende Blockly-Script per Mail zusenden.

                                    vowillV Offline
                                    vowillV Offline
                                    vowill
                                    schrieb am zuletzt editiert von
                                    #23

                                    @lui1307
                                    Gerne per privater Mail; siehe Chat.

                                    ioBroker im lxc auf NUC / Aktive Instanzen: 38

                                    L 1 Antwort Letzte Antwort
                                    0
                                    • vowillV vowill

                                      @lui1307
                                      Gerne per privater Mail; siehe Chat.

                                      L Offline
                                      L Offline
                                      lui1307
                                      schrieb am zuletzt editiert von lui1307
                                      #24

                                      @vowill blank

                                      1 Antwort Letzte Antwort
                                      0
                                      • A Offline
                                        A Offline
                                        aleks-83
                                        schrieb am zuletzt editiert von
                                        #25

                                        Hi,

                                        bei mir wird der JSON offenbar nicht richtig ins bar chart gelesen.
                                        Was kann ich tun?

                                        JSON string:

                                        [{"total":0.2637,"energy":0.0581,"tax":0.2056,"startsAt":"2024-02-20T00:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2592,"energy":0.0543,"tax":0.2049,"startsAt":"2024-02-20T01:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2588,"energy":0.054,"tax":0.2048,"startsAt":"2024-02-20T02:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2582,"energy":0.0535,"tax":0.2047,"startsAt":"2024-02-20T03:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2576,"energy":0.053,"tax":0.2046,"startsAt":"2024-02-20T04:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2598,"energy":0.0548,"tax":0.205,"startsAt":"2024-02-20T05:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2785,"energy":0.0705,"tax":0.208,"startsAt":"2024-02-20T06:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2998,"energy":0.0884,"tax":0.2114,"startsAt":"2024-02-20T07:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.3027,"energy":0.0909,"tax":0.2118,"startsAt":"2024-02-20T08:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2881,"energy":0.0786,"tax":0.2095,"startsAt":"2024-02-20T09:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2777,"energy":0.0698,"tax":0.2079,"startsAt":"2024-02-20T10:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.267,"energy":0.0609,"tax":0.2061,"startsAt":"2024-02-20T11:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2583,"energy":0.0535,"tax":0.2048,"startsAt":"2024-02-20T12:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2558,"energy":0.0514,"tax":0.2044,"startsAt":"2024-02-20T13:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2562,"energy":0.0518,"tax":0.2044,"startsAt":"2024-02-20T14:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2614,"energy":0.0562,"tax":0.2052,"startsAt":"2024-02-20T15:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2696,"energy":0.0631,"tax":0.2065,"startsAt":"2024-02-20T16:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2785,"energy":0.0705,"tax":0.208,"startsAt":"2024-02-20T17:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2794,"energy":0.0712,"tax":0.2082,"startsAt":"2024-02-20T18:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.282,"energy":0.0735,"tax":0.2085,"startsAt":"2024-02-20T19:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2761,"energy":0.0685,"tax":0.2076,"startsAt":"2024-02-20T20:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2676,"energy":0.0613,"tax":0.2063,"startsAt":"2024-02-20T21:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2622,"energy":0.0569,"tax":0.2053,"startsAt":"2024-02-20T22:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2574,"energy":0.0528,"tax":0.2046,"startsAt":"2024-02-20T23:00:00.000+01:00","currency":"EUR","level":"NORMAL"}]
                                        

                                        bar chart im vis:


                                        1a0e1144-38c5-4f84-bf17-27a162259521-image.png

                                        bar chart widget:

                                        [{"tpl":"tplVis-materialdesign-Chart-Bar","data":{"oid":"tibberlink.0.Homes.e9a4eb21-162a-45f3-a1b5-90fc54b2d566.PricesToday.json","g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","chartDataMethod":"inputPerEditor","dataCount":"1","chartType":"vertical","backgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background","chartAreaBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background_chart","titleLayout":"#mdwTheme:vis-materialdesign.0.fontSizes.card.title","titleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.card.title","colorBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background","colorTitleSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_title","colorTextSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_body","colorTitle":"#mdwTheme:vis-materialdesign.0.colors.card.title","globalColor":"#mdwTheme:vis-materialdesign.0.colors.charts.global","hoverColor":"#mdwTheme:vis-materialdesign.0.colors.charts.bar.hover","hoverBorderColor":"#mdwTheme:vis-materialdesign.0.colors.charts.bar.hover_border","showValues":"showValuesOn","valuesFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.value","valuesFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.value","valuesFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.value","valuesPositionAnchor":"end","valuesPositionAlign":"top","valuesTextAlign":"center","yAxisPosition":"left","yAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_title","yAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_title","yAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_title","yAxisValueLabelColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_values","yAxisValueFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_values","yAxisValueFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_values","yAxisValueDistanceToAxis":"10","yAxisShowAxis":"true","yAxisShowAxisLabels":"true","yAxisShowGridLines":"true","yAxisGridLinesColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_gridlines","yAxisShowTicks":"true","yAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_zeroline","xAxisPosition":"bottom","xAxisTicksSource":"auto","xAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_title","xAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_title","xAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_title","xAxisValueLabelColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_values","xAxisValueFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_values","xAxisValueFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_values","xAxisValueDistanceToAxis":"0","xAxisShowAxis":"true","xAxisShowAxisLabels":"true","xAxisShowGridLines":"true","xAxisGridLinesColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_gridlines","xAxisShowTicks":"true","xAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_zeroline","xAxisMinRotation":"0","xAxisMaxRotation":"0","legendPosition":"right","legendFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.legend","legendFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.legend","legendFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.legend","legendPointStyle":"true","showTooltip":"true","tooltipBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_background","tooltipShowColorBox":"true","tooltipTitleFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_title","tooltipTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_title","tooltipTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_title","tooltipBodyFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_text","tooltipBodyFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_text","tooltipBodyFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_text","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0},"style":{"left":"395px","top":"210px","width":"954px","height":"427px"},"widgetSet":"materialdesign"}]
                                        

                                        = Dell Optiplex Micro - 10GB RAM - 200GB SSD - Debian VM =
                                        = Node.js v20.18.3 = NPM 10.2.3 = JS Controller 7.0.6 =

                                        Ubiquiti UAP-AC-LR - UAP-AC-Lite - Synology DS716+II - Fritz!Box 7490
                                        Glasfaser 400

                                        vowillV 1 Antwort Letzte Antwort
                                        0
                                        • A aleks-83

                                          Hi,

                                          bei mir wird der JSON offenbar nicht richtig ins bar chart gelesen.
                                          Was kann ich tun?

                                          JSON string:

                                          [{"total":0.2637,"energy":0.0581,"tax":0.2056,"startsAt":"2024-02-20T00:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2592,"energy":0.0543,"tax":0.2049,"startsAt":"2024-02-20T01:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2588,"energy":0.054,"tax":0.2048,"startsAt":"2024-02-20T02:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2582,"energy":0.0535,"tax":0.2047,"startsAt":"2024-02-20T03:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2576,"energy":0.053,"tax":0.2046,"startsAt":"2024-02-20T04:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2598,"energy":0.0548,"tax":0.205,"startsAt":"2024-02-20T05:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2785,"energy":0.0705,"tax":0.208,"startsAt":"2024-02-20T06:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2998,"energy":0.0884,"tax":0.2114,"startsAt":"2024-02-20T07:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.3027,"energy":0.0909,"tax":0.2118,"startsAt":"2024-02-20T08:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2881,"energy":0.0786,"tax":0.2095,"startsAt":"2024-02-20T09:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2777,"energy":0.0698,"tax":0.2079,"startsAt":"2024-02-20T10:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.267,"energy":0.0609,"tax":0.2061,"startsAt":"2024-02-20T11:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2583,"energy":0.0535,"tax":0.2048,"startsAt":"2024-02-20T12:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2558,"energy":0.0514,"tax":0.2044,"startsAt":"2024-02-20T13:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2562,"energy":0.0518,"tax":0.2044,"startsAt":"2024-02-20T14:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2614,"energy":0.0562,"tax":0.2052,"startsAt":"2024-02-20T15:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2696,"energy":0.0631,"tax":0.2065,"startsAt":"2024-02-20T16:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2785,"energy":0.0705,"tax":0.208,"startsAt":"2024-02-20T17:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2794,"energy":0.0712,"tax":0.2082,"startsAt":"2024-02-20T18:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.282,"energy":0.0735,"tax":0.2085,"startsAt":"2024-02-20T19:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2761,"energy":0.0685,"tax":0.2076,"startsAt":"2024-02-20T20:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2676,"energy":0.0613,"tax":0.2063,"startsAt":"2024-02-20T21:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2622,"energy":0.0569,"tax":0.2053,"startsAt":"2024-02-20T22:00:00.000+01:00","currency":"EUR","level":"NORMAL"},{"total":0.2574,"energy":0.0528,"tax":0.2046,"startsAt":"2024-02-20T23:00:00.000+01:00","currency":"EUR","level":"NORMAL"}]
                                          

                                          bar chart im vis:


                                          1a0e1144-38c5-4f84-bf17-27a162259521-image.png

                                          bar chart widget:

                                          [{"tpl":"tplVis-materialdesign-Chart-Bar","data":{"oid":"tibberlink.0.Homes.e9a4eb21-162a-45f3-a1b5-90fc54b2d566.PricesToday.json","g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","chartDataMethod":"inputPerEditor","dataCount":"1","chartType":"vertical","backgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background","chartAreaBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background_chart","titleLayout":"#mdwTheme:vis-materialdesign.0.fontSizes.card.title","titleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.card.title","colorBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background","colorTitleSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_title","colorTextSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_body","colorTitle":"#mdwTheme:vis-materialdesign.0.colors.card.title","globalColor":"#mdwTheme:vis-materialdesign.0.colors.charts.global","hoverColor":"#mdwTheme:vis-materialdesign.0.colors.charts.bar.hover","hoverBorderColor":"#mdwTheme:vis-materialdesign.0.colors.charts.bar.hover_border","showValues":"showValuesOn","valuesFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.value","valuesFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.value","valuesFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.value","valuesPositionAnchor":"end","valuesPositionAlign":"top","valuesTextAlign":"center","yAxisPosition":"left","yAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_title","yAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_title","yAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_title","yAxisValueLabelColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_values","yAxisValueFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_values","yAxisValueFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_values","yAxisValueDistanceToAxis":"10","yAxisShowAxis":"true","yAxisShowAxisLabels":"true","yAxisShowGridLines":"true","yAxisGridLinesColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_gridlines","yAxisShowTicks":"true","yAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_zeroline","xAxisPosition":"bottom","xAxisTicksSource":"auto","xAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_title","xAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_title","xAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_title","xAxisValueLabelColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_values","xAxisValueFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_values","xAxisValueFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_values","xAxisValueDistanceToAxis":"0","xAxisShowAxis":"true","xAxisShowAxisLabels":"true","xAxisShowGridLines":"true","xAxisGridLinesColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_gridlines","xAxisShowTicks":"true","xAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_zeroline","xAxisMinRotation":"0","xAxisMaxRotation":"0","legendPosition":"right","legendFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.legend","legendFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.legend","legendFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.legend","legendPointStyle":"true","showTooltip":"true","tooltipBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_background","tooltipShowColorBox":"true","tooltipTitleFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_title","tooltipTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_title","tooltipTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_title","tooltipBodyFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_text","tooltipBodyFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_text","tooltipBodyFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_text","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0},"style":{"left":"395px","top":"210px","width":"954px","height":"427px"},"widgetSet":"materialdesign"}]
                                          

                                          vowillV Offline
                                          vowillV Offline
                                          vowill
                                          schrieb am zuletzt editiert von
                                          #26

                                          @aleks-83 Hm, laut der Doku von ECharts hier ist nur ein Wert je Zeitpunkt zugelassen sowie keine 'start'-Festlegung.

                                          ioBroker im lxc auf NUC / Aktive Instanzen: 38

                                          1 Antwort Letzte Antwort
                                          0
                                          Antworten
                                          • In einem neuen Thema antworten
                                          Anmelden zum Antworten
                                          • Älteste zuerst
                                          • Neuste zuerst
                                          • Meiste Stimmen


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          382

                                          Online

                                          32.4k

                                          Benutzer

                                          81.4k

                                          Themen

                                          1.3m

                                          Beiträge
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Anmelden

                                          • Du hast noch kein Konto? Registrieren

                                          • Anmelden oder registrieren, um zu suchen
                                          • Erster Beitrag
                                            Letzter Beitrag
                                          0
                                          • Home
                                          • Aktuell
                                          • Tags
                                          • Ungelesen 0
                                          • Kategorien
                                          • Unreplied
                                          • Beliebt
                                          • GitHub
                                          • Docu
                                          • Hilfe