Neuer ioBroker-Blog online: Monatsrückblick März/April 2026

[Negalein]

@sigi234 sagte in Diagramm mehrerer Datenpunkte ohne History:

Übrigens Table geht auch:

Wie funktioniert das mit der Tabelle?
Ich kann da nur 1 DP auswählen.

Könntest du mir den Export deiner Tabelle (Widget) schicken, damit ich mir das ansehen kann?

[paul53]

@sigi234 sagte:

Wie bekomme ich eigentlich bei Zeit h und bei den anderen °C mit angezeigt?
Bei unit einfach eintragen?

Nein, das funktioniert nur mit Zahlen - nicht mit einem Array. Es wird das angezeigt, was im Array enthalten ist. Wenn °C angezeigt werden soll, dann müssen Strings mit °C in das Array geschrieben werden.

      tempVals[(dayCnt*8)+hourCnt] = getState(path+'Day_'+(dayCnt+1)+'.Hour_'+(hourCnt+1)+'.temp_value').val + ' °C';

[sigi234]

@Negalein sagte in Diagramm mehrerer Datenpunkte ohne History:

@sigi234 sagte in Diagramm mehrerer Datenpunkte ohne History:

Übrigens Table geht auch:

Wie funktioniert das mit der Tabelle?
Ich kann da nur 1 DP auswählen.

Könntest du mir den Export deiner Tabelle (Widget) schicken, damit ich mir das ansehen kann?

[{"tpl":"tplTableBody","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":true,"g_css_background":true,"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","static_value":"","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,"table_oid":"javascript.0.vis.dasWetterTable","max_rows":"8","colCount":"6","new_on_top":true,"colWidth1":"60px","colWidth2":"60px","colWidth3":"60px","colWidth4":"60px","colName2":"","colWidth5":"60px","colWidth6":"60px","class":""},"style":{"left":"32px","top":"320px","width":"571px","height":"204px","z-index":"5","text-align":"center","font-size":"medium","color":"","background-color":"","background":""},"widgetSet":"basic"}]

[Negalein]

@sigi234 sagte in Diagramm mehrerer Datenpunkte ohne History:

[{"tpl":"tplTableBody","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":true,"g_css_background":true,"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","static_value":"","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,"table_oid":"javascript.0.vis.dasWetterTable","max_rows":"8","colCount":"6","new_on_top":true,"colWidth1":"60px","colWidth2":"60px","colWidth3":"60px","colWidth4":"60px","colName2":"","colWidth5":"60px","colWidth6":"60px","class":""},"style":{"left":"32px","top":"320px","width":"571px","height":"204px","z-index":"5","text-align":"center","font-size":"medium","color":"","background-color":"","background":""},"widgetSet":"basic"}]

Funktioniert nicht bei mir.

Ich hab keinen DP javascript.0.vis.dasWetterTable

[sigi234]

@Negalein sagte in Diagramm mehrerer Datenpunkte ohne History:

@sigi234 sagte in Diagramm mehrerer Datenpunkte ohne History:

Funktioniert nicht bei mir.

Ich hab keinen DP javascript.0.vis.dasWetterTable

Du brauchst das Skript von @paul53

var path    = "daswetter.0.NextDaysDetailed.Location_1."; // Pfad der String-Datenpunkte aus "list"
var idTable = "vis.dasWetterTable"; // Pfad des Datenpunkts für das vis-Json

// Datenpunkte anlegen
createState(idTable, "", {
  name: idTable,
  desc: 'Tabelle der Vorhersagewerte aus daswetter.com als Json-Objekt',
  type: 'string',
  unit: '',
  role: 'value'
});

function wetter() {
   var list = [];
   for(let i = 0; i < 8; i++) {
      list[i] = {};
      list[i].Zeit = getState(path + 'Day_1.Hour_' + (i + 1) + '.hour_value').val;
      list[i].Heute = getState(path + 'Day_1.Hour_' + (i + 1) + '.temp_value').val;
      list[i].Morgen = getState(path + 'Day_2.Hour_' + (i + 1) + '.temp_value').val;
      list[i].Tag_2 = getState(path + 'Day_3.Hour_' + (i + 1) + '.temp_value').val;
      list[i].Tag_3 = getState(path + 'Day_4.Hour_' + (i + 1) + '.temp_value').val;
      list[i].Tag_4 = getState(path + 'Day_5.Hour_' + (i + 1) + '.temp_value').val;
   }   
   var json = JSON.stringify(list);
   // log(json);
   setState(idTable, json, true);
}

// Trigger
schedule('10 */15 * * * *', wetter);

[Negalein]

@sigi234

Danke!
Ich hatte das von @dtp

[Negalein]

@sigi234

Hast du die Zeile für die Einheiten (°C, km/h, %, mm) schon eingefügt?
Wo gehört das im Script von @paul53 eingetragen?

[paul53]

@Negalein sagte:

Wo gehört das im Script von @paul53 eingetragen?

Das Skript liefert nur die Temperaturwerte. Mit °C:

      list[i].Heute = getState(path + 'Day_1.Hour_' + (i + 1) + '.temp_value').val + ' °C';
      list[i].Morgen = getState(path + 'Day_2.Hour_' + (i + 1) + '.temp_value').val + ' °C';
      list[i].Tag_2 = getState(path + 'Day_3.Hour_' + (i + 1) + '.temp_value').val + ' °C';
      list[i].Tag_3 = getState(path + 'Day_4.Hour_' + (i + 1) + '.temp_value').val + ' °C';
      list[i].Tag_4 = getState(path + 'Day_5.Hour_' + (i + 1) + '.temp_value').val + ' °C';

[Negalein]

@paul53 sagte in Diagramm mehrerer Datenpunkte ohne History:

@Negalein sagte:

Wo gehört das im Script von @paul53 eingetragen?

Das Skript liefert nur die Temperaturwerte. Mit °C:

Könnte man das auf die anderen Werte noch erweitern?

[paul53]

@Negalein sagte:

Könnte man das auf die anderen Werte noch erweitern?

Wie soll die Tabelle dann aussehen ? Oder mehrere Tabellen ?

[Negalein]

@paul53 sagte in Diagramm mehrerer Datenpunkte ohne History:

@Negalein sagte:

Könnte man das auf die anderen Werte noch erweitern?

Wie soll die Tabelle dann aussehen ? Oder mehrere Tabellen ?

So wie die Tabelle von @dtp ungefähr
Beispiel

[paul53]

@Negalein 40 Zeilen ?

[Negalein]

@paul53 sagte in Diagramm mehrerer Datenpunkte ohne History:

@Negalein 40 Zeilen ?

So zB hätte ich gedacht

[dtp]

Hier gingen jetzt zwei Sachen durcheinander. Zum Einen das Skript von @paul53 zur Erstellung einer JSON-Tabelle und dann meine Version, die die Grundlage für charts.js bilden sollte. Das sollten wir vielleicht klarer trennen.

Mir ging es in erster Linie um eine grafische Darstellung der Vorhersagewerte. Eine JSON-Tabelle ist da ggf. nicht so zielführend, zumal man die Werte ja auch problemlos einzeln mit entsprechenden Widgets als Tabelle darstellen kann.

@paul53: hab die Units aus den Array-Datenpunkten ebenfalls entfernt. Danke für den Hinweis.

Hab mir nun mal charts.js mit

npm install chart.js --save

installiert. Unter node_modules befinden sich auch die entsprechenden charts.js-Verzeichnisse. Doch nun stocke ich bei der Erstellung des entsprechenden Skripts mit

require(['chart.js/dist/Chart.js'], function(Chart){
  var myChart = new Chart(ctx, {...});
});

Wie und wo zeige ich die entsprechenden Daten an? Jemand eine Idee?

[Negalein]

@dtp sagte in Diagramm mehrerer Datenpunkte ohne History:

Mir ging es in erster Linie um eine grafische Darstellung der Vorhersagewerte.

Ja, das möchte ich auch!
Mit dem Script von @paul53 funktioniert das leider nicht.

[paul53]

@Negalein sagte:

So zB hätte ich gedacht

Versuche es mal so (nicht getestet)

var path    = "daswetter.0.NextDaysDetailed.Location_1.Day_"; // Pfad der String-Datenpunkte aus "list"
var idTable = "vis.dasWetterTable"; // Pfad des Datenpunkts für das vis-Json

// Datenpunkte anlegen
createState(idTable, "", {
  name: idTable,
  desc: 'Tabelle der Vorhersagewerte aus daswetter.com als Json-Objekt',
  type: 'string',
  role: 'json'
});

function wetter() {
   var list = [];
   for(let i = 0; i < 20; i++) {
      var j = i % 4;
      var sensor = 'temp_value';
      var unit = '°C';
      if(j == 1) {
	     sensor = 'humidity_value';
	     unit = '%rH';
      } 
      else if(j == 2) {
	     sensor = 'rain_value';
	     unit = 'mm';
      }		 
      else if(j == 3) {
	     sensor = 'wind_value';
             unit = 'km/h';
      }		 
      var day = Math.floor(i / 4);
      var tage = ['Heute','Morgen','Tag 2','Tag 3','Tag 4']
      list[i] = {};
      if(j == 0) list[i].Tag = tage[day];
      list[i].Sensor = unit;
      day = day + 1;
      list[i]['02:00'] = getState(path + day + '.Hour_1.' + sensor).val;
      list[i]['05:00'] = getState(path + day + '.Hour_2.' + sensor).val;
      list[i]['08:00'] = getState(path + day + '.Hour_3.' + sensor).val;
      list[i]['11:00'] = getState(path + day + '.Hour_4.' + sensor).val;
      list[i]['14:00'] = getState(path + day + '.Hour_5.' + sensor).val;
      list[i]['17:00'] = getState(path + day + '.Hour_6.' + sensor).val;
      list[i]['20:00'] = getState(path + day + '.Hour_7.' + sensor).val;
      list[i]['23:00'] = getState(path + day + '.Hour_8.' + sensor).val;
   }   
   var json = JSON.stringify(list);
   // log(json);
   setState(idTable, json, true);
}

// Trigger
schedule('10 */15 * * * *', wetter);

[Negalein]

@paul53 sagte in Diagramm mehrerer Datenpunkte ohne History:

@Negalein sagte:

So zB hätte ich gedacht

Versuche es mal so (nicht getestet)

Funktioniert leider nicht.
Aber egal. Ich versuchs irgendwie grafisch umzusetzen.

Danke

[paul53]

@Negalein
Ändere mal

      if(j == 0) list[i].Tag = tage[day];

in

      if(j == 0) list[i].Tag = tage[day];
      else list[i].Tag = '';

[sigi234]

@paul53 sagte in Diagramm mehrerer Datenpunkte ohne History:

@Negalein
Ändere mal

      if(j == 0) list[i].Tag = tage[day];

in

      if(j == 0) list[i].Tag = tage[day];
      else list[i].Tag = '';

Schaut bei mir so aus:

Edit:

[dtp]

Also das finde ich aber ehrlich gesagt alles andere, als übersichtlich. Da würde ich lieber bei der Ansicht aus meinem Ausgangsposting bleiben.

Eigentlich schwebte mir eher sowas vor: