Monatsrückblick Januar/Februar 2026 ist online!

[TT-Tom]

@theknut

Eigentlich hast du recht, das Originalscript war für ein Messwert und mehr kann der Chart auch nicht anzeigen. Wir werden im Wiki es erwähnen und hierher verlinken.

[Rene55]

@tt-tom Ich kenne nicht alle eurer Ideen. Sicher kann ein Chart nur die Daten eines Messwertes anzeigen. Es ist aber auch ein bisschen bescheiden, wenn ein User 3 verschiedene Charts haben möchte und dafür drei Scripte laufen lassen muss. Oder habe ich deinen Einwurf falsch verstanden?

[Armilar]

@rene55

Jo, warum 3 unterschiedliche Scripte?

Macht die Sache nicht so wissenschaftlich und setzt alle Sensoren in ein Script:

Beispiel (läuft bei mir genau so und nicht anders - und das seit Monaten):

const Debug = false;

const NSPanel_Path = '0_userdata.0.NSPanel.';
const Path = NSPanel_Path + 'Influx2NSPanel.cardLChart.';
let   PathSensor = '';

let SensorName = ['EG.Buero.Temperatur',
                  'EG.Gaeste_WC.Temperatur',
                  'EG.Wohnzimmer.Temperatur',
                  'EG.Hauswirtschaftsraum.Temperatur',
                  'EG.Flur_vorne.Temperatur',
                  'EG.Flur_hinten.Temperatur',
                  'EG.Esszimmer.Temperatur',
                  'EG.Kaminzimmer.Temperatur',
                  'EG.Badezimmer.Temperatur',
                  'EG.Kueche.Temperatur',
                  'OG.Schlafzimmer_1.Temperatur',
                  'OG.Gaestezimmer.Temperatur',
                  'OG.Hobbyraum.Temperatur',
                  'Gartenhaus.Temperatur'];

const Sensor = [].concat('deconz.0.Sensors.5.temperature')  // EG.Buero.Temperatur
                 .concat('deconz.0.Sensors.12.temperature')  // EG.Gaeste_WC.Temperatur
                 .concat('deconz.0.Sensors.53.temperature')  // EG.Wohnzimmer.Temperatur
                 .concat('deconz.0.Sensors.19.temperature')  // EG.Hauswirtschaftsraum.Temperatur
                 .concat('deconz.0.Sensors.9.temperature')   // EG.Flur_vorne.Temperatur
                 .concat('deconz.0.Sensors.27.temperature')  // EG.Flur_hinten.Temperatur
                 .concat('deconz.0.Sensors.40.temperature')  // EG.Esszimmer.Temperatur
                 .concat('deconz.0.Sensors.37.temperature')  // EG.Kaminzimmer.Temperatur
                 .concat('deconz.0.Sensors.45.temperature')  // EG.Badezimmer.Temperatur
                 .concat('deconz.0.Sensors.25.temperature')  // EG.Kueche.Temperature
                 .concat('deconz.0.Sensors.57.temperature')  // OG.Schlafzimmer_1.Temperatur
                 .concat('deconz.0.Sensors.60.temperature')  // OG.Gaestezimmer.Temperatur
                 .concat('deconz.0.Sensors.63.temperature')  // OG.Hobbyraum.Temperatur
                 .concat('deconz.0.Sensors.30.temperature'); // Gartenhaus.Temperatur
                 
let   triggeredSensor = 0;

const numberOfHoursAgo = 24;
const xAxisTicksEveryM = 60;
const xAxisLabelEveryM = 240;

const InfluxInstance = 'influxdb.1';

// Ab hier keine Ändeungen

let coordinates = ''; 

on({ id: Sensor, change: 'any' }, async function (obj) {
    
    if (Debug) log(obj.id, 'info');
    if (Debug) log(SensorName[Sensor.indexOf(obj.id)], 'info')

    PathSensor = Path + SensorName[Sensor.indexOf(obj.id)]

    if (existsObject(PathSensor) == false) {
        createState(PathSensor, 0, {
            name: 'SensorGrid',
            desc: 'Sensor Values [~<time>:<value>]*',
            type: 'string',
            role: 'value',
        });
    }

    let query =[
        'from(bucket: "iobroker")',
        '|> range(start: -' + numberOfHoursAgo + 'h)',
        '|> filter(fn: (r) => r["_measurement"] == "' + obj.id + '")',
        '|> filter(fn: (r) => r["_field"] == "value")',
        '|> drop(columns: ["from", "ack", "q"])',
        '|> aggregateWindow(every: 1h, fn: last, createEmpty: false)',
        '|> map(fn: (r) => ({ r with _rtime: int(v: r._time) - int(v: r._start)}))',
        '|> yield(name: "_result")'].join('');

    if (Debug) log('Query: ' + query, 'info');

    sendTo(InfluxInstance, 'query', query, function (result) {
        if (result.error) {
            console.error(result.error);
        } else {
            // show result
            if (Debug) log(result, 'info');
            let numResults = result.result.length;
            for (let r = 0; r < numResults; r++) 
            {
                let list = []
                let numValues = result.result[r].length;

                for (let i = 0; i < numValues; i++) 
                {
                    let time = Math.round(result.result[r][i]._rtime/1000/1000/1000/60);
                    let value = Math.round(result.result[r][i]._value * 10);
                    list.push(time + ":" + value);
                }

                coordinates = list.join("~");

                if (Debug) log(coordinates, 'info');
            }
        }
    });

    let timeOut = setTimeout (
        function () {
            let ticksAndLabelsList = []
            let date = new Date();
            date.setMinutes(0, 0, 0);
            let ts = Math.round(date.getTime() / 1000);
            let tsYesterday = ts - (numberOfHoursAgo * 3600);
            if (Debug) log('Iterate from ' + tsYesterday + ' to ' + ts + ' stepsize=' + (xAxisTicksEveryM * 60), 'info');
            for (let x = tsYesterday, i = 0; x < ts; x += (xAxisTicksEveryM * 60), i += xAxisTicksEveryM)
            {
                if ((i % xAxisLabelEveryM))
                    ticksAndLabelsList.push(i);
                else
                {
                    let currentDate = new Date(x * 1000);
                    // Hours part from the timestamp
                    let hours = '0' + String(currentDate.getHours());
                    // Minutes part from the timestamp
                    let minutes = '0' + String(currentDate.getMinutes());
                    let formattedTime = hours.slice(-2) + ':' + minutes.slice(-2);

                    ticksAndLabelsList.push(String(i) + '^' + formattedTime);
                }
            }
            if (Debug) log('Ticks & Label: ' + ticksAndLabelsList, 'info');
            if (Debug) log('Coordinates: ' + coordinates, 'info');
            setState(PathSensor, ticksAndLabelsList.join('+') + '~' + coordinates, true);
        }, 
    1500
    ) ;
});

Und wie immer sind eurer Phantasie keine Grenzen gesetzt, daraus ein Flugzeug zu bauen...

[TT-Tom]

@rene55
Viele User fehlt das Verständnis für die Scripte, das ist unsere Erfahrung über die Zeit. Es gibt immer etwas zu optimieren, es soll aber auch einfach zu bedienen und verständlich sein. Darum immer der Versuch die Einstellmöglichkeiten so gering wie möglich und verständlich zu halten.

Wie geschrieben werde ich die optimierte Variante mit erwähnen und verlinken.

[Rene55]

@armilar Naja, fliegen wollte ich nicht. Ich suche eigentlich nur nach einer einfachen, benutzerfreundlichen Lösung. Aber wir kommen der Sache näher.

Was macht eigentlich triggeredSensor ?

[Armilar]

@rene55 sagte in SONOFF NSPanel mit Lovelace UI:

Was macht eigentlich triggeredSensor ?

Speicher verbrauchen, da ungenutzt... ;-)

obj.id hat ja die Infos

Mache mir bei den funktionalen Scripten nicht immer die Arbeit alles überflüssige zu entfernen... Ist ja nur ein Beispiel - nicht das Bestreben damit einen Preis zu gewinnen :blush:

[Rene55]

@armilar Mercy, ich versuche nur, alles zu verstehen :flushed:

[ticaki]

@rene55
Ich denke so alt wird keiner :) aber versuchen kann mans ja.

[Rene55]

@armilar @theknut @ticaki Um dieses Thema abzuschließen habe ich das Script jetzt soweit angepasst, dass es für mich passt. Es wäre schön, wenn einer von Euch mal drübergucken könnte.

Spoiler

/*
   *   Grundgedanke von //https://github.com/joBr99/nspanel-lovelace-ui/blob/main/ioBroker/Blockly/CardLChart_Influx2.ts
   *   Anpassungen für InfluxDB-Aliase by Rene55 [02.02.2024]
   *
*/
const Debug = false;
//
const NSPanel_Path = '0_userdata.0.NSPanel.';
const Path = NSPanel_Path + 'Influx2NSPanel.cardLChart.';
const InfluxInstance = 'influxdb.0';
const influxDbBucket = 'storage_short';
const numberOfHoursAgo = 24;
const xAxisTicksEveryM = 60;
const xAxisLabelEveryM = 240;
//

const sensors : Record<string, Record<string,string>> = {};
/*      ↓ Id of the sensor     ↓ Id of the data source for the charts  [↓ Alias for measurement]  */
sensors['mqtt.0.arexx.bad'] = {'target':'EG.Bad_Temperatur'}
sensors['mqtt.0.arexx.badH'] = {'target':'EG.Bad_Luftfeuchte'}
sensors['mqtt.0.arexx.vorne'] = {'target':'aussen_temperature', 'dbAlias':'Temperatur_vorne'}

//  #####   ab hier keine Änderungen mehr nötig   #####

//___________________________
// Beschreibe diese Funktion: create data source for NsPanel on script startup
Object.keys(sensors).forEach(async id => {
   await generateDateAsync(id);
});

//___________________________
// Beschreibe diese Funktion: listen to the sensors and update the data source states accordingly
on({ id: Object.keys(sensors), change: 'any' }, async function (obj) {
   if (!obj.id) {
       return;
   }
   await generateDateAsync(obj.id);
});

//___________________________
// Beschreibe diese Funktion: Daten generieren
async function generateDateAsync(sensorId: string) {
   let measurement:string = sensors[sensorId].dbAlias
   if (measurement =='' ||measurement == undefined) {measurement = sensorId}
   const dataPointId:string = Path + sensors[sensorId].target +'.ACTUAL'
   if (Debug) log(`(f) generateDateAsync: ${sensorId} ${dataPointId} > ${measurement}`)
   
   const query =[
       'from(bucket: "' + influxDbBucket + '")',
       '|> range(start: -' + numberOfHoursAgo + 'h)',
       '|> filter(fn: (r) => r["_measurement"] == "' + measurement + '")',
       '|> filter(fn: (r) => r["_field"] == "value")',
       '|> drop(columns: ["from", "ack", "q"])',
       '|> aggregateWindow(every: 1h, fn: last, createEmpty: false)',
       '|> map(fn: (r) => ({ r with _rtime: int(v: r._time) - int(v: r._start)}))',
       '|> yield(name: "_result")'].join('');

   if (Debug) console.log('Query: ' + query);

   const result : any = await sendToAsync(InfluxInstance, 'query', query);
   if (result.error) {
       console.error(result.error);
       return;
   }
   if (Debug) console.log(result);
   const numResults = result.result.length;
   let coordinates : string = '';
   for (let r = 0; r < numResults; r++) 
   {
       const list : string[] = []
       const numValues = result.result[r].length;

       for (let i = 0; i < numValues; i++) 
       {
           const time = Math.round(result.result[r][i]._rtime/1000/1000/1000/60);
           const value = Math.round(result.result[r][i]._value * 10);
           list.push(time + ":" + value);
       }

       coordinates = list.join("~");
       if (Debug) console.log(coordinates);
   }

   const ticksAndLabelsList : string[] = []
   const date = new Date();
   date.setMinutes(0, 0, 0);
   const ts = Math.round(date.getTime() / 1000) 
   const tsYesterday = ts - (numberOfHoursAgo * 3600)
   if (Debug) console.log('Iterate from ' + tsYesterday + ' to ' + ts + ' stepsize=' + (xAxisTicksEveryM * 60));
   for (let x = tsYesterday, i = 0; x < ts; x += (xAxisTicksEveryM * 60), i += xAxisTicksEveryM)
   {
       if ((i % xAxisLabelEveryM))
           ticksAndLabelsList.push('' + i);
       else
       {
           const currentDate = new Date(x * 1000);
           // Hours part from the timestamp
           const hours = "0" + String(currentDate.getHours());
           // Minutes part from the timestamp
           const minutes = "0" + String(currentDate.getMinutes());
           const formattedTime = hours.slice(-2) + ':' + minutes.slice(-2);

           ticksAndLabelsList.push(String(i) + "^" + formattedTime);
       }
   }
   if (Debug) console.log('Ticks & Label: ' + ticksAndLabelsList);
   if (Debug) console.log('Coordinates: ' + coordinates);
   await setOrCreate(dataPointId, ticksAndLabelsList.join("+") + '~' + coordinates, true);
}

//___________________________
// Beschreibe diese Funktion: Datenpunkte anlegen bzw. schreiben
async function setOrCreate(id : string, value : any, ack : boolean) {
   if (!(await existsStateAsync(id))) {
        await createStateAsync(id, value, {
           name: id.split('.').reverse()[0],
           desc: 'Sensor Values [~<time>:<value>]*',
           type: 'string',
           role: 'value',
       });
   } else {
       await setStateAsync(id, value, ack);
   }
}
//
//   E N D E
//

Das mit const sensors : Record<string, string> passt dann bei mir nicht so richtig. Ich hoffe, es ist trotzdem noch TS-Konform.

[ticaki]

@rene55
alles geschriebene von mir ist unnötig. Mit record gehts auch - zumindest in vscode. Wieder was gelernt.

Ok nach genauerem Hinsehen müsste das wohl so ausssehen:

Record<string, Record<string,string>>

[icebear]

Hallo zusammen

Ich hab grad auf die V4.3.3.39 das update gemacht (vorher v4.3.3.31), jetzt bekomm ich beim Start folgenden Fehler:

javascript.0
2024-02-02 13:32:47.495	error	script.js.NSPanel.NSPanelTS_1_v4_3_3_39: TypeScript compilation failed:let WLAN: PageType = { ^ERROR: Type '{ type: "cardQR"; heading: string; subPage: true; prev: string; home: string; homeIcon: string; items: [{ id: string; hidePassword: true; autoCreateALias: true; }, { id: string; }]; }' is not assignable to type 'PageType'. Types of property ''items'' are incompatible. Type '[{ id: string; hidePassword: true; autoCreateALias: true; }, { id: string; }]' is not assignable to type '[PageItem] & PageItem[]'. Type '[{ id: string; hidePassword: true; autoCreateALias: true; }, { id: string; }]' is not assignable to type '[PageItem]'. Source has 2 element(s) but target allows only 1

Hab ich irgendwas verpasst?

[TT-Tom]

@icebear

zeige mal die config von der Page.

sieht aus als ob due 2 pageItem hast

[icebear]

@tt-tom

let WLAN: PageType = 
{
    'type': 'cardQR',
    'heading': 'Gäste WLAN',
    'subPage': true,
	'prev': 'Abfall',
	'home': 'Grundstueck',
	'homeIcon': 'home-roof',
    'items': [
		{ id: 'alias.0.NSPanel.GuestWifi', hidePassword: true, autoCreateALias: true },
        { id: 'alias.0.NSPanel.GuestWifi.SWITCH'},
	
	]
};

[ticaki]

@icebear sagte in SONOFF NSPanel mit Lovelace UI:

Source has 2 element(s) but target allows only 1

Denke mal 1 Pageitem zuviel angegeben -> [{ id: string; hidePassword: true; autoCreateALias: true; }, { id: string; }]

[TT-Tom]

@icebear sagte in SONOFF NSPanel mit Lovelace UI:

{ id: 'alias.0.NSPanel.GuestWifi.SWITCH'},

der kann weg. den Switch sucht er sich alleine.

[icebear]

@tt-tom said in SONOFF NSPanel mit Lovelace UI:

@icebear sagte in SONOFF NSPanel mit Lovelace UI:

{ id: 'alias.0.NSPanel.GuestWifi.SWITCH'},

der kann weg. den Switch sucht er sich alleine.

Ich danke dir, das wars.

[Rene55]

@ticaki Jepp, det funzt. Ich muss mich noch schwer in TS reinfuchsen. Danke.

[Rene55]

@armilar Gibt es für cardChart auch ein Script für die Aufbereitung der Daten? Ich wollte auch so etwas umsetzen wie 'ChartsDemo' für Gas oder 'Stromzähler L1+L2+L3'.

[Armilar]

@rene55

https://github.com/joBr99/nspanel-lovelace-ui/wiki/ioBroker-Card-Definitionen-(Seiten)#cardchart-ab-ts-script-v370

etwas unterhalb ist ein abgebildetes Blockly für influxDB2

darunter der Link zum Blockly

yAxisTicks sind im Gegensatz zur cardLChart nicht automatisiert und müssen definiert werden.

Der Daten-String ist anders aufgebaut, da er keine Koordinaten, sondern Werte zum Zeitpunkt X enthält...

[TT-Tom]

@rene55
offiziell im Wiki für Influx nur als Blockly. BalkenChart oder auf meinem git als TypeScript.