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

  • Wartung am 15.11. – Forum ab 22:00 Uhr nicht erreichbar
    BluefoxB
    Bluefox
    11
    2
    196

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

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

SONOFF NSPanel mit Lovelace UI

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.
  • ArmilarA Armilar

    @teletapi

    Ja ich habe jetzt erstmal bei den Paulmannleuchten die sollen ja laut Datenblatt RGBW sein bei "Weiß" das "level" rausgemacht und durch den Datenpunkt "Hue" ersetezt

    HUE steuert alles über 0-360°...

    Somit kannst du, wenn du einen HUE Datenpunkt hast, die komplette Lampe steuern... Nimm dazu mal den Alias-Typ HUE...

    Dann brauchst du nur:

    • HUE = hue
    • DIMMER = level
    • ON = on
    • ON_ACTUAL = on
    • TEMPERATURE = ct

    Beispiel:

    let Test_Color_HUE: PageType =
    {
        type: 'cardEntities',
        useColor: true,
        heading: 'Test Color HUE',
        'items': [
            { 
                id: 'alias.0.DeinAlias', 
                name: 'HUE (CT=Kelvin)',
                icon: 'lightbulb-on',
                icon2: 'lightbulb-outline',
                offColor: Off,
                minValueColorTemp: 2203, // Kelvin = Warmweiß
                maxValueColorTemp: 6536, // Kelvin = Kaltweiß
                interpolateColor: true
            },
        ]
    };
    
    P Offline
    P Offline
    peterfido
    wrote on last edited by
    #7273

    @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.

    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

    teletapiT 1 Reply Last reply
    0
    • 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 Offline
      teletapiT Offline
      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 Offline
                        teletapiT Offline
                        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 Offline
                              teletapiT Offline
                              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 Offline
                                    teletapiT Offline
                                    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 Offline
                                        teletapiT Offline
                                        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
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          170

                                          Online

                                          32.4k

                                          Users

                                          81.3k

                                          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