Skip to content
  • Recent
  • Tags
  • 0 Unread 0
  • Categories
  • Unreplied
  • Popular
  • 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

  • Default (No Skin)
  • No Skin
Collapse
Logo
  1. ioBroker Community Home
  2. Deutsch
  3. Hardware
  4. SONOFF NSPanel mit Lovelace UI

NEWS

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

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

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

SONOFF NSPanel mit Lovelace UI

Scheduled Pinned Locked Moved Hardware
lovelace uinspanelsonoff
7.7k Posts 271 Posters 6.7m Views 253 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • P peterfido

    @armilar Der Gerätemanager hat einen Bug. Hat man eine nicht-HUE-Leuchte konfiguriert, wird beim nächsten neuen anzulegenden Gerät wieder das Modell angeboten, obwohl man HUE ausgewählt hat. Da muss man Vor dem Anlegen des Gerätes die Seite ohne Cache neu laden (STRG + F5). Da erscheint dann auch der gewollte HUE Datenpunkt, wenn man HUE auswählt.

    Die abgebrochenen Geräte kann man vorher aus den Objekten löschen, sonst ist der Name ja schon belegt.

    teletapiT Online
    teletapiT Online
    teletapi
    wrote on last edited by
    #7274

    Danke allen bin nocham testen, muss aber noch was arbeiten schau ich mir am späten Abend nochmal an. Hab jetzt nochmal verschiedenes verändert. Komme aber im Moment noch nicht wirklich weiter danke bis später
    Hawe

    1 Reply Last reply
    0
    • arteckA Offline
      arteckA Offline
      arteck
      Developer Most Active
      wrote on last edited by
      #7275

      welchen Alias definiere ich für sowas

      {
        "type": "state",
        "common": {
          "name": "cmd",
          "read": true,
          "write": true,
          "type": "string",
          "role": "state",
          "def": ""
        },
        "native": {},
        "from": "system.adapter.mytime.0",
        "user": "system.user.admin",
        "ts": 1731410376623,
        "_id": "mytime.0.Countdowns.sprinkler.cmd",
        "acl": {
          "object": 1638,
          "state": 1638,
          "owner": "system.user.admin",
          "ownerGroup": "system.group.administrator"
        }
      }
      

      ich muss da run oder stop rein schreiben

      zigbee hab ich, zwave auch, nuc's genauso und HA auch

      ArmilarA 1 Reply Last reply
      0
      • arteckA arteck

        welchen Alias definiere ich für sowas

        {
          "type": "state",
          "common": {
            "name": "cmd",
            "read": true,
            "write": true,
            "type": "string",
            "role": "state",
            "def": ""
          },
          "native": {},
          "from": "system.adapter.mytime.0",
          "user": "system.user.admin",
          "ts": 1731410376623,
          "_id": "mytime.0.Countdowns.sprinkler.cmd",
          "acl": {
            "object": 1638,
            "state": 1638,
            "owner": "system.user.admin",
            "ownerGroup": "system.group.administrator"
          }
        }
        

        ich muss da run oder stop rein schreiben

        ArmilarA Offline
        ArmilarA Offline
        Armilar
        Most Active Forum Testing
        wrote on last edited by Armilar
        #7276

        @arteck

        sieht für mich erstmal wie ein Schalter (socket oder light) aus...

        Die sind zwar per default Boolean, jedoch kannst du ja bei true/false entsprechend den Alias mit run/stop schreiben lassen und lesend in bool konvertieren.

        Hoffe ich habe das richtig verstanden... 😊

        Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
        https://github.com/joBr99/nspanel-lovelace-ui/wiki

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

        1 Reply Last reply
        0
        • arteckA Offline
          arteckA Offline
          arteck
          Developer Most Active
          wrote on last edited by
          #7277

          @armilar aha.. auf die Idee bin ich nicht gekommen..aber hast recht

          zigbee hab ich, zwave auch, nuc's genauso und HA auch

          1 Reply Last reply
          1
          • H Offline
            H Offline
            hansi44
            wrote on last edited by
            #7278

            Hallo liebe community,

            ich hab mal wieder eine frage zum NSPanel..
            Ich versuche gerade die Hauptseiten im Display anzupassen und als eine erste Seite neben der "Service-Menü"-Seite eine Seite für meine PV-Werte mit der cardpower-Karte anzeigen zu lassen.
            Ich habe dabei versucht mich an die Anleitung für die cardpower-Karte zu halten, habe keine Werte eingetragen, damit die Seite erstmal im Demo-Modus angezeigt werden soll
            97f5cfe0-8be0-4f87-9711-2a7320df8cea-grafik.png
            Habe dann versucht, in der Konfiguration diese cardpower-Seite als Hauptseite neben dem Service Menü zu listen, in der Hoffnung, dass ich dann im Service-Menü mit den links/rechts Pfeiltasten auf die cardpower-Karte komme
            c44d91ef-c1e9-4526-a7ca-53dde7dbbc2d-grafik.png
            Leider kann ich diese cardpower-Seite durch die Pfeile im Service-Menü nicht erreichen, im log kommt folgende Meldung
            6fc18a19-f370-4f1e-bcb1-2a61851ba27b-grafik.png
            Kann mir jemand von euch einen Tipp geben? VG

            P T 2 Replies Last reply
            0
            • H hansi44

              Hallo liebe community,

              ich hab mal wieder eine frage zum NSPanel..
              Ich versuche gerade die Hauptseiten im Display anzupassen und als eine erste Seite neben der "Service-Menü"-Seite eine Seite für meine PV-Werte mit der cardpower-Karte anzeigen zu lassen.
              Ich habe dabei versucht mich an die Anleitung für die cardpower-Karte zu halten, habe keine Werte eingetragen, damit die Seite erstmal im Demo-Modus angezeigt werden soll
              97f5cfe0-8be0-4f87-9711-2a7320df8cea-grafik.png
              Habe dann versucht, in der Konfiguration diese cardpower-Seite als Hauptseite neben dem Service Menü zu listen, in der Hoffnung, dass ich dann im Service-Menü mit den links/rechts Pfeiltasten auf die cardpower-Karte komme
              c44d91ef-c1e9-4526-a7ca-53dde7dbbc2d-grafik.png
              Leider kann ich diese cardpower-Seite durch die Pfeile im Service-Menü nicht erreichen, im log kommt folgende Meldung
              6fc18a19-f370-4f1e-bcb1-2a61851ba27b-grafik.png
              Kann mir jemand von euch einen Tipp geben? VG

              P Offline
              P Offline
              peterfido
              wrote on last edited by
              #7279

              @hansi44

              Meine Cardpower Puzzleteile:

              Definition:

              let CardPower: PageType =
              {
                 "type": "cardPower",
                 "heading": "Stromfluss",
              //    "useColor": true,
                 "subPage": false,
                 "parent": undefined,
                 "items": [
              //        /*PageItem*/{  }, //Demomode
                     {id: "alias.0.NSPanel.StromPanel" }
                 ]
              };
              

              Pages:

                 pages: [
                     //Button_1,
                     //NSPanel_Service, //Auto-Alias Service Page
                     Buero_Seite_1,
                     Schlafen_Oben_1,
              //        Arbeiten_Licht2,
                     Buero_Themostat,        
                     Bel_Terrasse,           //Beleuchtung Terasse
                     Terrasse_Speichern,   //Terrasse Speichern / Standard
                     CardPower,              //Strom
                     GWLAN,
                    // Unlock_Service            //Auto-Alias Service Page (Service Pages used with cardUnlock)
                     NSPanel_Service           
                 ],
              

              Der Alias verweist auf einen anderen Datenpunkt:
              833644e3-e9ce-4812-a27a-dfc58d40cb2d-image.png

              NSPanel.Aktuell ist ein String

              {
               "common": {
                 "type": "string",
                 "value": "",
                 "read": true,
                 "write": true,
                 "role": "value",
                 "name": "0_userdata.0.Zaehler.Strom.NSPanel.Aktuell"
               },
               "native": {},
               "type": "state",
               "from": "system.adapter.javascript.0",
               "user": "system.user.admin",
               "ts": 1682841779977,
               "_id": "0_userdata.0.Zaehler.Strom.NSPanel.Aktuell",
               "acl": {
                 "object": 1636,
                 "state": 1636,
                 "owner": "system.user.admin",
                 "ownerGroup": "system.group.administrator"
               }
              }
              

              welcher von einem Skript gefüllt wird:

              /**
              * generate an JSON for display Power-Card on NSPanel
              * Source: https://github.com/joBr99/nspanel-lovelace-ui/wiki/ioBroker-Card-Definitionen-(Seiten)#cardpower-ab-ts-script-v341
              * Version: 0.1 - L4rs
              */
              //'*/20 * * * * *'
              schedule("*/20 * * * * *", function () {
              
                 // Definition der Datenpunkte für das JSON der POWER-Card und der anzuzeigenden Leistungswerte
                 var powerCardJson = "0_userdata.0.Zaehler.Strom.NSPanel.Aktuell",
                   pwr1 = Math.round(getState("0_userdata.0.Zaehler.PV.ist.P1").val),    // Solar
                   pwr2 = Math.round(getState("nut.0.ups.realpower").val),    // Solar
                   pwr3 = Math.round(getState("0_userdata.0.Wallbox.Strom.Auslese.Arbeit").val), // Auto
                   pwr4 = Math.round(getState("0_userdata.0.Zaehler.Strom.EVU.ist.P").val),    // Stromnetz
                   pwr5 = Math.round(getState("nut.2.ups.load").val*3.3),   // Verbraucher
                   pwr6 = Math.round(getState("0_userdata.0.Zaehler.Strom.Herd.ist.P").val),   // Verbraucher
                   pwrWallbox = getState("0_userdata.0.Wallbox.freigegeben").val,
                   iconWallbox = pwrWallbox ? "car-electric" : "car", 
                   pwrHome = Math.round(pwr4 + pwr1),    // Berechnung des Energiefluss anstelle eines Datenpunktes
                   sppwr1 = Math.round(pwr1/-61),         //pwr2 > 0 ? -2 : 0
                   sppwr3 = Math.round(pwr3/(1100)),         //pwr2 > 0 ? -2 : 0
                   sppwr6 = Math.round(pwr6/(-1100));         //pwr2 > 0 ? -2 : 0
                 
                 if(pwr1 > 0 && sppwr1 == 0 ){ sppwr1 = -1};
                 if(pwr3 > 0 && sppwr3 == 0 ){ sppwr3 = 1};
                 if(pwr6 > 0 && sppwr6 == 0 ){ sppwr6 = -1};
                 sppwr1 > 10 ? 10 : sppwr1;
                 sppwr3 > 10 ? 10 : sppwr3;
                 sppwr6 > 10 ? 10 : sppwr6;
              
                 // Definition der Keys im JSON
                 var keys = ["id", "value", "unit", "icon", "iconColor", "speed"];
                 
                 // Definition der "Kacheln", inkl. StandardIcon. Es können alle Icon aus dem Iconmapping genutzt werden.
                 // Kacheln die nicht genutzt werden sollen, müssen wie z.b. item1 formatiert sein
                 var home = [0, pwrHome, "W", "home-lightning-bolt-outline", 0]; // Icon home
                 var item1 = [1, pwr1, "W", "solar-power-variant-outline", 5, sppwr1];   // Icon battery-charging-60
                 var item2 = [2, pwr2, "W", "server-security", 5, 5]; // Icon solar-power-variant
                 var item3 = [3, pwr3, "W", iconWallbox, 3, sppwr3];   // Icon wind-turbine
                 var item4 = [4, pwr4, "W", "transmission-tower", 10, pwr4 > 0 ? 5 : -5];   // Icon shape
                 var item5 = [5, pwr5, "W", "server", 5, -5];   // Icon transmission-tower
                 var item6 = [6, pwr6, "W", "toaster-oven", 7, sppwr6];  // Icon car car-electric-outline
                 
                 /**
                  * JSON generieren und in den Datenpunkt schreiben,
                  *
                  *  --- ab hier keine Änderungen mehr ---
                  */
                 function func(tags, values) {
                   return Object.assign(
                     ...tags.map((element, index) => ({ [element]: values[index] }))
                   );
                 }
                 
                 setState(
                   powerCardJson,
                   JSON.stringify([
                     func(keys, home),
                     func(keys, item1),
                     func(keys, item2),
                     func(keys, item3),
                     func(keys, item4),
                     func(keys, item5),
                     func(keys, item6),
                   ])
                 );
                });
              

              Gruß

              Peterfido


              Proxmox auf Intel NUC12WSHi5
              ioBroker: Debian (VM)
              CCU: Debmatic (VM)
              Influx: Debian (VM)
              Grafana: Debian (VM)
              eBus: Debian (VM)
              Zigbee: Debian (VM) mit zigbee2mqtt

              1 Reply Last reply
              1
              • H hansi44

                Hallo liebe community,

                ich hab mal wieder eine frage zum NSPanel..
                Ich versuche gerade die Hauptseiten im Display anzupassen und als eine erste Seite neben der "Service-Menü"-Seite eine Seite für meine PV-Werte mit der cardpower-Karte anzeigen zu lassen.
                Ich habe dabei versucht mich an die Anleitung für die cardpower-Karte zu halten, habe keine Werte eingetragen, damit die Seite erstmal im Demo-Modus angezeigt werden soll
                97f5cfe0-8be0-4f87-9711-2a7320df8cea-grafik.png
                Habe dann versucht, in der Konfiguration diese cardpower-Seite als Hauptseite neben dem Service Menü zu listen, in der Hoffnung, dass ich dann im Service-Menü mit den links/rechts Pfeiltasten auf die cardpower-Karte komme
                c44d91ef-c1e9-4526-a7ca-53dde7dbbc2d-grafik.png
                Leider kann ich diese cardpower-Seite durch die Pfeile im Service-Menü nicht erreichen, im log kommt folgende Meldung
                6fc18a19-f370-4f1e-bcb1-2a61851ba27b-grafik.png
                Kann mir jemand von euch einen Tipp geben? VG

                T Offline
                T Offline
                TT-Tom
                wrote on last edited by TT-Tom
                #7280

                @hansi44

                Okay, durch die Typenprüfung hat der Demomodus jetzt ein BUG. Werde schnell ein Fix machen.

                EDIT: Du kannst den Fix direkt in deinem Script machen oder dir die DEV Version runterladen.

                suche diese Zeilen im Script

                function GeneratePowerPage (page: NSPanel.PagePower): NSPanel.Payload[] {
                    try {
                        let obj: object = {};
                        let demoMode = false;
                        if (page.items[0].id == undefined) {
                            log('No PageItem defined - cardPower demo mode active', 'info');
                            demoMode = true;
                        }
                

                und ersetze if (page.items[0].id == undefined) { durch if (page.items[0].id === 'DEMO') {

                in deiner config schreibst du dann für den Demomodus

                "items": [
                        {id: "DEMO" }
                    ]
                

                Gruß Tom
                https://github.com/tt-tom17
                Wenn meine Hilfe erfolgreich war, benutze bitte das Voting unten rechts im Beitrag

                NSPanel Script Wiki
                https://github.com/joBr99/nspanel-lovelace-ui/wiki

                NSPanel Adapter Wiki
                https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki

                1 Reply Last reply
                3
                • arteckA Offline
                  arteckA Offline
                  arteck
                  Developer Most Active
                  wrote on last edited by
                  #7281

                  kann ich die fonst grösse hier beeinflussen
                  d20735a6-29d5-42b3-a959-f188f9ad81dd-grafik.png

                  zigbee hab ich, zwave auch, nuc's genauso und HA auch

                  ArmilarA 1 Reply Last reply
                  0
                  • arteckA arteck

                    kann ich die fonst grösse hier beeinflussen
                    d20735a6-29d5-42b3-a959-f188f9ad81dd-grafik.png

                    ArmilarA Offline
                    ArmilarA Offline
                    Armilar
                    Most Active Forum Testing
                    wrote on last edited by
                    #7282

                    @arteck

                    nein, an der Stelle nicht... Nur den Wert selbst

                    Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
                    https://github.com/joBr99/nspanel-lovelace-ui/wiki

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

                    teletapiT arteckA 2 Replies Last reply
                    0
                    • ArmilarA Armilar

                      @arteck

                      nein, an der Stelle nicht... Nur den Wert selbst

                      teletapiT Online
                      teletapiT Online
                      teletapi
                      wrote on last edited by teletapi
                      #7283

                      Morjen, ich hab da noch Fragen ;-), ich hab mir mit eurer Hilfe Anleitungen und ein wenig Chatgpt versucht ein JS script zu basteln um mal mit der Powercard zu spielen und einen Teil meiner PV Anlage wiederzugeben.
                      Da wird das batteriesymbol jetzt im Moment grün dargestellt könnte man diese farbe dynamisch oder ggf. auch statisch ändern lassen wenn Voll dann grün wenn geladen wird Rot..?

                      Hier Das Script:

                      schedule("* * * * *", function () {
                          var powerCardJson = "0_userdata.0.NSPanel.Powercard";
                      
                          var pwr1Raw = getState("0_userdata.0.PV.now.Battery_Power").val || 0;
                          var pwr1 = Math.abs(Math.round(pwr1Raw));  // Betrag für Anzeige
                          var pwr2 = Math.round(getState("modbus.0.holdingRegisters._Total_Active_power_(Grid_Meter)").val);
                          var pwr3 = "";
                          var pwr4 = "";
                          var pwr5 = Math.round(getState("sonoff.0.Tasmota Energie LG E320.E320_Power_in").val);
                          var pwr6 = 0;
                          var pwrHome = Math.round(getState("0_userdata.0.PV.now.Load_Total_Power").val || 0);
                      
                          var keys = ["id", "value", "unit", "icon", "iconColor", "speed"];
                          var helperBase = "0_userdata.0.NSPanel.PowercardHelper";
                      
                          if (!existsObject(helperBase)) {
                              createState(helperBase, null, { type: "channel", common: { name: "PowercardHelper" }, native: {} });
                          }
                      
                          function createStateIfNotExists(id, initialValue = 0) {
                              if (!existsState(id)) {
                                  createState(id, initialValue, {
                                      name: "Last Power Wert",
                                      role: "value",
                                      type: "number",
                                      unit: "W",
                                      read: true,
                                      write: false
                                  });
                              }
                          }
                      
                          createStateIfNotExists(helperBase + ".PWR1_Last");
                          createStateIfNotExists(helperBase + ".PWR2_Last");
                          createStateIfNotExists(helperBase + ".PWR5_Last");
                      
                          function getLastValue(id) {
                              var s = getState(id);
                              return s ? s.val : 0;
                          }
                      
                          function setLastValue(id, val) {
                              setState(id, val, true);
                          }
                      
                          function calcSpeed(current, last) {
                              if (current > last) return 2;
                              else if (current < last) return -2;
                              else return 0;
                          }
                      
                          var pwr1Last = getLastValue(helperBase + ".PWR1_Last");
                          var pwr2Last = getLastValue(helperBase + ".PWR2_Last");
                          var pwr5Last = getLastValue(helperBase + ".PWR5_Last");
                      
                          var speedPwr1 = calcSpeed(pwr1Raw, pwr1Last);  // Richtung basiert auf Originalwert
                          var speedPwr2 = calcSpeed(pwr2, pwr2Last);
                          var speedPwr5 = calcSpeed(pwr5, pwr5Last);
                      
                          setLastValue(helperBase + ".PWR1_Last", pwr1Raw);
                          setLastValue(helperBase + ".PWR2_Last", pwr2);
                          setLastValue(helperBase + ".PWR5_Last", pwr5);
                      
                          var home = [0, pwrHome, "W", "home-lightning-bolt-outline", 0, 0];
                      
                          // Batterie → ID 1
                          var item1 = [1, pwr1, "W", "battery-high", 3, speedPwr1];
                      
                          var item2 = [2, pwr2, "W", "solar-power-variant-outline", 3, speedPwr2];
                          var item3 = [3, pwr3, "", "", 0, 0];
                          var item4 = [4, pwr4, "", "", 0, 0];
                          var item5 = [5, pwr5, "W", "transmission-tower", 10, speedPwr5];
                          var item6 = [6, pwr6, "kW", "", 0, 0];
                      
                          function func(tags, values) {
                              return tags.reduce((acc, tag, index) => {
                                  acc[tag] = values[index];
                                  return acc;
                              }, {});
                          }
                      
                          setState(
                              powerCardJson,
                              JSON.stringify([
                                  func(keys, home),
                                  func(keys, item1),
                                  func(keys, item2),
                                  func(keys, item3),
                                  func(keys, item4),
                                  func(keys, item5),
                                  func(keys, item6),
                              ])
                          );
                      });
                      

                      Hier meine Powercard:

                      let CardPower: PageType =
                              {
                                  "type": "cardPower",
                                  "heading": "Energiefluss",
                      //          "useColor": true,
                                  "subPage": false,
                                  "parent": undefined,
                                  "items": [
                                      {id: "alias.0.NSPanel.PowerCard", alwaysOnDisplay: true}
                                       //   interpolateColor: true}
                               ]
                      };
                      

                      Und hier ein Bild wie es derzeit aussieht:
                      WhatsApp Bild 2025-06-23 um 14.41.49_67dd7821.jpg

                      T 1 Reply Last reply
                      0
                      • teletapiT teletapi

                        Morjen, ich hab da noch Fragen ;-), ich hab mir mit eurer Hilfe Anleitungen und ein wenig Chatgpt versucht ein JS script zu basteln um mal mit der Powercard zu spielen und einen Teil meiner PV Anlage wiederzugeben.
                        Da wird das batteriesymbol jetzt im Moment grün dargestellt könnte man diese farbe dynamisch oder ggf. auch statisch ändern lassen wenn Voll dann grün wenn geladen wird Rot..?

                        Hier Das Script:

                        schedule("* * * * *", function () {
                            var powerCardJson = "0_userdata.0.NSPanel.Powercard";
                        
                            var pwr1Raw = getState("0_userdata.0.PV.now.Battery_Power").val || 0;
                            var pwr1 = Math.abs(Math.round(pwr1Raw));  // Betrag für Anzeige
                            var pwr2 = Math.round(getState("modbus.0.holdingRegisters._Total_Active_power_(Grid_Meter)").val);
                            var pwr3 = "";
                            var pwr4 = "";
                            var pwr5 = Math.round(getState("sonoff.0.Tasmota Energie LG E320.E320_Power_in").val);
                            var pwr6 = 0;
                            var pwrHome = Math.round(getState("0_userdata.0.PV.now.Load_Total_Power").val || 0);
                        
                            var keys = ["id", "value", "unit", "icon", "iconColor", "speed"];
                            var helperBase = "0_userdata.0.NSPanel.PowercardHelper";
                        
                            if (!existsObject(helperBase)) {
                                createState(helperBase, null, { type: "channel", common: { name: "PowercardHelper" }, native: {} });
                            }
                        
                            function createStateIfNotExists(id, initialValue = 0) {
                                if (!existsState(id)) {
                                    createState(id, initialValue, {
                                        name: "Last Power Wert",
                                        role: "value",
                                        type: "number",
                                        unit: "W",
                                        read: true,
                                        write: false
                                    });
                                }
                            }
                        
                            createStateIfNotExists(helperBase + ".PWR1_Last");
                            createStateIfNotExists(helperBase + ".PWR2_Last");
                            createStateIfNotExists(helperBase + ".PWR5_Last");
                        
                            function getLastValue(id) {
                                var s = getState(id);
                                return s ? s.val : 0;
                            }
                        
                            function setLastValue(id, val) {
                                setState(id, val, true);
                            }
                        
                            function calcSpeed(current, last) {
                                if (current > last) return 2;
                                else if (current < last) return -2;
                                else return 0;
                            }
                        
                            var pwr1Last = getLastValue(helperBase + ".PWR1_Last");
                            var pwr2Last = getLastValue(helperBase + ".PWR2_Last");
                            var pwr5Last = getLastValue(helperBase + ".PWR5_Last");
                        
                            var speedPwr1 = calcSpeed(pwr1Raw, pwr1Last);  // Richtung basiert auf Originalwert
                            var speedPwr2 = calcSpeed(pwr2, pwr2Last);
                            var speedPwr5 = calcSpeed(pwr5, pwr5Last);
                        
                            setLastValue(helperBase + ".PWR1_Last", pwr1Raw);
                            setLastValue(helperBase + ".PWR2_Last", pwr2);
                            setLastValue(helperBase + ".PWR5_Last", pwr5);
                        
                            var home = [0, pwrHome, "W", "home-lightning-bolt-outline", 0, 0];
                        
                            // Batterie → ID 1
                            var item1 = [1, pwr1, "W", "battery-high", 3, speedPwr1];
                        
                            var item2 = [2, pwr2, "W", "solar-power-variant-outline", 3, speedPwr2];
                            var item3 = [3, pwr3, "", "", 0, 0];
                            var item4 = [4, pwr4, "", "", 0, 0];
                            var item5 = [5, pwr5, "W", "transmission-tower", 10, speedPwr5];
                            var item6 = [6, pwr6, "kW", "", 0, 0];
                        
                            function func(tags, values) {
                                return tags.reduce((acc, tag, index) => {
                                    acc[tag] = values[index];
                                    return acc;
                                }, {});
                            }
                        
                            setState(
                                powerCardJson,
                                JSON.stringify([
                                    func(keys, home),
                                    func(keys, item1),
                                    func(keys, item2),
                                    func(keys, item3),
                                    func(keys, item4),
                                    func(keys, item5),
                                    func(keys, item6),
                                ])
                            );
                        });
                        

                        Hier meine Powercard:

                        let CardPower: PageType =
                                {
                                    "type": "cardPower",
                                    "heading": "Energiefluss",
                        //          "useColor": true,
                                    "subPage": false,
                                    "parent": undefined,
                                    "items": [
                                        {id: "alias.0.NSPanel.PowerCard", alwaysOnDisplay: true}
                                         //   interpolateColor: true}
                                 ]
                        };
                        

                        Und hier ein Bild wie es derzeit aussieht:
                        WhatsApp Bild 2025-06-23 um 14.41.49_67dd7821.jpg

                        T Offline
                        T Offline
                        TT-Tom
                        wrote on last edited by
                        #7284

                        @teletapi Mach doch aus dem iconColor eine variable und setze den Wert je nach Wunsch.

                        ["id", "value", "unit", "icon", "iconColor", "speed"]
                        [1, pwr1, "W", "battery-high", 3, speedPwr1]
                        

                        Gruß Tom
                        https://github.com/tt-tom17
                        Wenn meine Hilfe erfolgreich war, benutze bitte das Voting unten rechts im Beitrag

                        NSPanel Script Wiki
                        https://github.com/joBr99/nspanel-lovelace-ui/wiki

                        NSPanel Adapter Wiki
                        https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki

                        teletapiT 1 Reply Last reply
                        0
                        • ArmilarA Armilar

                          @arteck

                          nein, an der Stelle nicht... Nur den Wert selbst

                          arteckA Offline
                          arteckA Offline
                          arteck
                          Developer Most Active
                          wrote on last edited by
                          #7285

                          @armilar sagte in SONOFF NSPanel mit Lovelace UI:

                          @arteck

                          nein, an der Stelle nicht... Nur den Wert selbst

                          Andere Möglichkeiten?
                          Zeilenumbruch vielleicht?

                          zigbee hab ich, zwave auch, nuc's genauso und HA auch

                          ArmilarA 1 Reply Last reply
                          0
                          • T TT-Tom

                            @teletapi Mach doch aus dem iconColor eine variable und setze den Wert je nach Wunsch.

                            ["id", "value", "unit", "icon", "iconColor", "speed"]
                            [1, pwr1, "W", "battery-high", 3, speedPwr1]
                            
                            teletapiT Online
                            teletapiT Online
                            teletapi
                            wrote on last edited by teletapi
                            #7286

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

                            [1, pwr1, "W", "battery-high", 3, speedPwr1]

                            Wenn du mir jetzt noch sagen würdest wie, dann wäre ich dabei. Das sind alles spanische Dörfer für mich die verursachen bei mir Knoten im Kopf... 😉

                            T 1 Reply Last reply
                            0
                            • teletapiT teletapi

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

                              [1, pwr1, "W", "battery-high", 3, speedPwr1]

                              Wenn du mir jetzt noch sagen würdest wie, dann wäre ich dabei. Das sind alles spanische Dörfer für mich die verursachen bei mir Knoten im Kopf... 😉

                              T Offline
                              T Offline
                              TT-Tom
                              wrote on last edited by
                              #7287

                              @teletapi

                              Gib mir die Datenpunkte welche die Farben ändern sollen oder Grenzwerte, die die Farben ändern.

                              Gruß Tom
                              https://github.com/tt-tom17
                              Wenn meine Hilfe erfolgreich war, benutze bitte das Voting unten rechts im Beitrag

                              NSPanel Script Wiki
                              https://github.com/joBr99/nspanel-lovelace-ui/wiki

                              NSPanel Adapter Wiki
                              https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki

                              teletapiT 1 Reply Last reply
                              0
                              • arteckA arteck

                                @armilar sagte in SONOFF NSPanel mit Lovelace UI:

                                @arteck

                                nein, an der Stelle nicht... Nur den Wert selbst

                                Andere Möglichkeiten?
                                Zeilenumbruch vielleicht?

                                ArmilarA Offline
                                ArmilarA Offline
                                Armilar
                                Most Active Forum Testing
                                wrote on last edited by
                                #7288

                                @arteck

                                Text abkürzen würde mir aktuell nur einfallen...

                                Kurzer Blick auf das Layout der cardGrid2:

                                60a654f8-7f30-4bc2-b4da-0aee5d7f77f1-image.png

                                8 Entitäten, wobei bereits der Bezeichner in der kleinsten Schriftgröße ( Fontsize 0 ) ist. Jetzt könnte man denken, da wäre noch Platz - aber mit dem Zeilenumbruch landest du mit dem Text im nächsten Icon...

                                Installationsanleitung, Tipps, Alias-Definitionen, FAQ für das Sonoff NSPanel mit lovelace UI unter ioBroker
                                https://github.com/joBr99/nspanel-lovelace-ui/wiki

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

                                arteckA 1 Reply Last reply
                                0
                                • T TT-Tom

                                  @teletapi

                                  Gib mir die Datenpunkte welche die Farben ändern sollen oder Grenzwerte, die die Farben ändern.

                                  teletapiT Online
                                  teletapiT Online
                                  teletapi
                                  wrote on last edited by teletapi
                                  #7289

                                  @tt-tom Danke dir, ich hab als Datenpunkt derzeit: 0_userdata.0.PV.now.Battery_Power als lade/entlade datenpunkt müsste ja auch: modbus.0.holdingRegisters._BatterySOC funktionieren. Als möglichen Alias für Battery_soc hab ich diesen Alias angelegt: alias.0.NSPanel.PV_Anlage.Battery_Soc.SET

                                  Eigentlich geht es mir nur darum wenn Voll dann grün, beim Laden Rot und wenns möglich wäre fürs entladen gelb.

                                  Ich habe jetzt auch nochmal ChatGPT gefragt wegen der Variable für das iconColor.
                                  Da wurde mir das folgende angepasste script erzeugt.

                                  schedule("* * * * *", function () {
                                      var powerCardJson = "0_userdata.0.NSPanel.Powercard";
                                  
                                      var pwr1Raw = getState("0_userdata.0.PV.now.Battery_Power").val || 0;
                                      var pwr1 = Math.abs(Math.round(pwr1Raw));  // Betrag für Anzeige
                                      var pwr2 = Math.round(getState("modbus.0.holdingRegisters._Total_Active_power_(Grid_Meter)").val);
                                      var pwr3 = "";
                                      var pwr4 = "";
                                      var pwr5 = Math.round(getState("sonoff.0.Tasmota Energie LG E320.E320_Power_in").val);
                                      var pwr6 = 0;
                                      var pwrHome = Math.round(getState("0_userdata.0.PV.now.Load_Total_Power").val || 0);
                                  
                                      var keys = ["id", "value", "unit", "icon", "iconColor", "speed"];
                                      var helperBase = "0_userdata.0.NSPanel.PowercardHelper";
                                  
                                      if (!existsObject(helperBase)) {
                                          createState(helperBase, null, { type: "channel", common: { name: "PowercardHelper" }, native: {} });
                                      }
                                  
                                      function createStateIfNotExists(id, initialValue = 0) {
                                          if (!existsState(id)) {
                                              createState(id, initialValue, {
                                                  name: "Last Power Wert",
                                                  role: "value",
                                                  type: "number",
                                                  unit: "W",
                                                  read: true,
                                                  write: false
                                              });
                                          }
                                      }
                                  
                                      createStateIfNotExists(helperBase + ".PWR1_Last");
                                      createStateIfNotExists(helperBase + ".PWR2_Last");
                                      createStateIfNotExists(helperBase + ".PWR5_Last");
                                  
                                      function getLastValue(id) {
                                          var s = getState(id);
                                          return s ? s.val : 0;
                                      }
                                  
                                      function setLastValue(id, val) {
                                          setState(id, val, true);
                                      }
                                  
                                      function calcSpeed(current, last) {
                                          if (current > last) return 2;
                                          else if (current < last) return -2;
                                          else return 0;
                                      }
                                  
                                      var pwr1Last = getLastValue(helperBase + ".PWR1_Last");
                                      var pwr2Last = getLastValue(helperBase + ".PWR2_Last");
                                      var pwr5Last = getLastValue(helperBase + ".PWR5_Last");
                                  
                                      var speedPwr1 = calcSpeed(pwr1Raw, pwr1Last);  // Richtung basiert auf Originalwert
                                      var speedPwr2 = calcSpeed(pwr2, pwr2Last);
                                      var speedPwr5 = calcSpeed(pwr5, pwr5Last);
                                  
                                      setLastValue(helperBase + ".PWR1_Last", pwr1Raw);
                                      setLastValue(helperBase + ".PWR2_Last", pwr2);
                                      setLastValue(helperBase + ".PWR5_Last", pwr5);
                                  
                                      // Dynamische iconColor für Batterie
                                      var iconColorBatt;
                                      if (pwr1Raw > 50) {
                                          iconColorBatt = 3;  // rot → Laden
                                      } else if (pwr1Raw < -50) {
                                          iconColorBatt = 4;  // gelb → Entladen
                                      } else if (Math.abs(pwr1Raw) <= 50) {
                                          iconColorBatt = 7;  // grün → Voll
                                      } else {
                                          iconColorBatt = 1;  // grau → fallback
                                      }
                                  
                                      var home = [0, pwrHome, "W", "home-lightning-bolt-outline", 0, 0];
                                  
                                      // Batterie → ID 1
                                      var item1 = [1, pwr1, "W", "battery-high", iconColorBatt, speedPwr1];
                                  
                                      var item2 = [2, pwr2, "W", "solar-power-variant-outline", 3, speedPwr2];
                                      var item3 = [3, pwr3, "", "", 0, 0];
                                      var item4 = [4, pwr4, "", "", 0, 0];
                                      var item5 = [5, pwr5, "W", "transmission-tower", 10, speedPwr5];
                                      var item6 = [6, pwr6, "kW", "", 0, 0];
                                  
                                      function func(tags, values) {
                                          return tags.reduce((acc, tag, index) => {
                                              acc[tag] = values[index];
                                              return acc;
                                          }, {});
                                      }
                                  
                                      setState(
                                          powerCardJson,
                                          JSON.stringify([
                                              func(keys, home),
                                              func(keys, item1),
                                              func(keys, item2),
                                              func(keys, item3),
                                              func(keys, item4),
                                              func(keys, item5),
                                              func(keys, item6),
                                          ])
                                      );
                                  });
                                  
                                  
                                  T 1 Reply Last reply
                                  0
                                  • teletapiT teletapi

                                    @tt-tom Danke dir, ich hab als Datenpunkt derzeit: 0_userdata.0.PV.now.Battery_Power als lade/entlade datenpunkt müsste ja auch: modbus.0.holdingRegisters._BatterySOC funktionieren. Als möglichen Alias für Battery_soc hab ich diesen Alias angelegt: alias.0.NSPanel.PV_Anlage.Battery_Soc.SET

                                    Eigentlich geht es mir nur darum wenn Voll dann grün, beim Laden Rot und wenns möglich wäre fürs entladen gelb.

                                    Ich habe jetzt auch nochmal ChatGPT gefragt wegen der Variable für das iconColor.
                                    Da wurde mir das folgende angepasste script erzeugt.

                                    schedule("* * * * *", function () {
                                        var powerCardJson = "0_userdata.0.NSPanel.Powercard";
                                    
                                        var pwr1Raw = getState("0_userdata.0.PV.now.Battery_Power").val || 0;
                                        var pwr1 = Math.abs(Math.round(pwr1Raw));  // Betrag für Anzeige
                                        var pwr2 = Math.round(getState("modbus.0.holdingRegisters._Total_Active_power_(Grid_Meter)").val);
                                        var pwr3 = "";
                                        var pwr4 = "";
                                        var pwr5 = Math.round(getState("sonoff.0.Tasmota Energie LG E320.E320_Power_in").val);
                                        var pwr6 = 0;
                                        var pwrHome = Math.round(getState("0_userdata.0.PV.now.Load_Total_Power").val || 0);
                                    
                                        var keys = ["id", "value", "unit", "icon", "iconColor", "speed"];
                                        var helperBase = "0_userdata.0.NSPanel.PowercardHelper";
                                    
                                        if (!existsObject(helperBase)) {
                                            createState(helperBase, null, { type: "channel", common: { name: "PowercardHelper" }, native: {} });
                                        }
                                    
                                        function createStateIfNotExists(id, initialValue = 0) {
                                            if (!existsState(id)) {
                                                createState(id, initialValue, {
                                                    name: "Last Power Wert",
                                                    role: "value",
                                                    type: "number",
                                                    unit: "W",
                                                    read: true,
                                                    write: false
                                                });
                                            }
                                        }
                                    
                                        createStateIfNotExists(helperBase + ".PWR1_Last");
                                        createStateIfNotExists(helperBase + ".PWR2_Last");
                                        createStateIfNotExists(helperBase + ".PWR5_Last");
                                    
                                        function getLastValue(id) {
                                            var s = getState(id);
                                            return s ? s.val : 0;
                                        }
                                    
                                        function setLastValue(id, val) {
                                            setState(id, val, true);
                                        }
                                    
                                        function calcSpeed(current, last) {
                                            if (current > last) return 2;
                                            else if (current < last) return -2;
                                            else return 0;
                                        }
                                    
                                        var pwr1Last = getLastValue(helperBase + ".PWR1_Last");
                                        var pwr2Last = getLastValue(helperBase + ".PWR2_Last");
                                        var pwr5Last = getLastValue(helperBase + ".PWR5_Last");
                                    
                                        var speedPwr1 = calcSpeed(pwr1Raw, pwr1Last);  // Richtung basiert auf Originalwert
                                        var speedPwr2 = calcSpeed(pwr2, pwr2Last);
                                        var speedPwr5 = calcSpeed(pwr5, pwr5Last);
                                    
                                        setLastValue(helperBase + ".PWR1_Last", pwr1Raw);
                                        setLastValue(helperBase + ".PWR2_Last", pwr2);
                                        setLastValue(helperBase + ".PWR5_Last", pwr5);
                                    
                                        // Dynamische iconColor für Batterie
                                        var iconColorBatt;
                                        if (pwr1Raw > 50) {
                                            iconColorBatt = 3;  // rot → Laden
                                        } else if (pwr1Raw < -50) {
                                            iconColorBatt = 4;  // gelb → Entladen
                                        } else if (Math.abs(pwr1Raw) <= 50) {
                                            iconColorBatt = 7;  // grün → Voll
                                        } else {
                                            iconColorBatt = 1;  // grau → fallback
                                        }
                                    
                                        var home = [0, pwrHome, "W", "home-lightning-bolt-outline", 0, 0];
                                    
                                        // Batterie → ID 1
                                        var item1 = [1, pwr1, "W", "battery-high", iconColorBatt, speedPwr1];
                                    
                                        var item2 = [2, pwr2, "W", "solar-power-variant-outline", 3, speedPwr2];
                                        var item3 = [3, pwr3, "", "", 0, 0];
                                        var item4 = [4, pwr4, "", "", 0, 0];
                                        var item5 = [5, pwr5, "W", "transmission-tower", 10, speedPwr5];
                                        var item6 = [6, pwr6, "kW", "", 0, 0];
                                    
                                        function func(tags, values) {
                                            return tags.reduce((acc, tag, index) => {
                                                acc[tag] = values[index];
                                                return acc;
                                            }, {});
                                        }
                                    
                                        setState(
                                            powerCardJson,
                                            JSON.stringify([
                                                func(keys, home),
                                                func(keys, item1),
                                                func(keys, item2),
                                                func(keys, item3),
                                                func(keys, item4),
                                                func(keys, item5),
                                                func(keys, item6),
                                            ])
                                        );
                                    });
                                    
                                    
                                    T Offline
                                    T Offline
                                    TT-Tom
                                    wrote on last edited by
                                    #7290

                                    @teletapi
                                    Ja sieht gut aus, so ähnlich hätte ich es auch gemacht.

                                    Gruß Tom
                                    https://github.com/tt-tom17
                                    Wenn meine Hilfe erfolgreich war, benutze bitte das Voting unten rechts im Beitrag

                                    NSPanel Script Wiki
                                    https://github.com/joBr99/nspanel-lovelace-ui/wiki

                                    NSPanel Adapter Wiki
                                    https://github.com/ticaki/ioBroker.nspanel-lovelace-ui/wiki

                                    teletapiT 1 Reply Last reply
                                    0
                                    • T TT-Tom

                                      @teletapi
                                      Ja sieht gut aus, so ähnlich hätte ich es auch gemacht.

                                      teletapiT Online
                                      teletapiT Online
                                      teletapi
                                      wrote on last edited by
                                      #7291

                                      @tt-tom Danke dir dann werde ich das mal so testen

                                      1 Reply Last reply
                                      0
                                      • ArmilarA Armilar

                                        @arteck

                                        Text abkürzen würde mir aktuell nur einfallen...

                                        Kurzer Blick auf das Layout der cardGrid2:

                                        60a654f8-7f30-4bc2-b4da-0aee5d7f77f1-image.png

                                        8 Entitäten, wobei bereits der Bezeichner in der kleinsten Schriftgröße ( Fontsize 0 ) ist. Jetzt könnte man denken, da wäre noch Platz - aber mit dem Zeilenumbruch landest du mit dem Text im nächsten Icon...

                                        arteckA Offline
                                        arteckA Offline
                                        arteck
                                        Developer Most Active
                                        wrote on last edited by
                                        #7292

                                        @armilar sagte in SONOFF NSPanel mit Lovelace UI:

                                        Text abkürzen würde mir aktuell nur einfallen...

                                        das hab ich schon ... sieht nur bähh aus

                                        zigbee hab ich, zwave auch, nuc's genauso und HA auch

                                        1 Reply Last reply
                                        0
                                        • MichaelFM MichaelF

                                          @armilar Danke, das war es.

                                          Grüße

                                          MichaelFM Offline
                                          MichaelFM Offline
                                          MichaelF
                                          wrote on last edited by MichaelF
                                          #7293

                                          @michaelf sagte in SONOFF NSPanel mit Lovelace UI:

                                          @armilar Danke, das war es.

                                          Grüße

                                          Hi, ein kleines Problem gibt es leider noch das Display schaltet sich nicht mehr nach der eingestellten Nachtzeit ab.

                                          Dimmer Nacht steht auf 0

                                          Gibt es vielleicht ein Tipp wo ich schauen muss ?

                                          Grade noch entdeckt:

                                          web.0
                                          2025-06-26 15:03:44.677	error	Error on "subscribeForeignStates": Alias alias.0.alias.0.NSPanel..Dimmode.brightnessDay.ACTUAL has no target
                                          
                                          web.0
                                          2025-06-26 15:03:44.676	warn	Alias alias.0.NSPanel.1.alias.0.NSPanel.1.Dimmode.brightnessDay.ACTUAL has no target 5
                                          
                                          web.0
                                          2025-06-26 15:03:44.676	warn	Alias alias.0.alias.0.NSPanel.1.Dimmode.brightnessDay.ACTUAL has no target 5
                                          
                                          web.0
                                          2025-06-26 15:03:44.675	warn	Alias alias.0.alias.0.NSPanel..Dimmode.brightnessDay.ACTUAL has no target 5
                                          
                                          web.0
                                          2025-06-26 15:03:42.347	info	==> Connected system.user.admin from ::ffff:192.168.178.252
                                          
                                          web.0
                                          2025-06-26 15:03:39.697	info	<== Disconnect system.user.admin from ::ffff:192.168.178.252 vis.0
                                          
                                          web.0
                                          2025-06-26 15:02:52.997	error	Error on "subscribeForeignStates": Alias alias.0.alias.0.NSPanel..Dimmode.brightnessDay.ACTUAL has no target
                                          
                                          web.0
                                          2025-06-26 15:02:52.996	warn	Alias alias.0.NSPanel.1.alias.0.NSPanel.1.Dimmode.brightnessDay.ACTUAL has no target 5
                                          
                                          web.0
                                          2025-06-26 15:02:52.996	warn	Alias alias.0.alias.0.NSPanel.1.Dimmode.brightnessDay.ACTUAL has no target 5
                                          
                                          web.0
                                          2025-06-26 15:02:52.995	warn	Alias alias.0.alias.0.NSPanel..Dimmode.brightnessDay.ACTUAL has no target 5
                                          

                                          Allerdings Funktioniert das Dimmen am Tag, meine ich zumindest.

                                          Grüße

                                          arteckA ArmilarA 2 Replies Last reply
                                          0
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          675

                                          Online

                                          32.4k

                                          Users

                                          81.4k

                                          Topics

                                          1.3m

                                          Posts
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Login

                                          • Don't have an account? Register

                                          • Login or register to search.
                                          • First post
                                            Last post
                                          0
                                          • Recent
                                          • Tags
                                          • Unread 0
                                          • Categories
                                          • Unreplied
                                          • Popular
                                          • GitHub
                                          • Docu
                                          • Hilfe