Skip to content
  • Home
  • 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
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. Tutorial: Vis-colorpicker CIE Color (x,y)

NEWS

  • Weihnachtsangebot 2025! 🎄
    BluefoxB
    Bluefox
    24
    1
    1.3k

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

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    14
    1
    2.6k

Tutorial: Vis-colorpicker CIE Color (x,y)

Scheduled Pinned Locked Moved Visualisierung
vismaterial ui
53 Posts 15 Posters 13.3k Views 26 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.
  • Stefan GlückS Offline
    Stefan GlückS Offline
    Stefan Glück
    wrote on last edited by
    #2

    danke,
    das habe ich jetzt 3 tage lang gesucht nachdem ich meine hue Bridge entsorgen will und auf deconz umstelle.
    jetzt bräuchte ich nur noch die Helligkeit in %, aber da werde ich wohl selber scripten (für alexa)

    1 Reply Last reply
    0
    • L Offline
      L Offline
      LoxDUS
      wrote on last edited by
      #3

      Das war es auch was ich gesucht habe. Hat super funktioniert. Ich habe noch den Helligkeitsregler mit eingefügt:

                      handler.push(function () {
                          if (cmd_id !== 'nothing_selected') {
                              // var cmd = '{"transitiontime":' + data.transitionTime + ',"xy":"' + picker.xy[0] + ',' + picker.xy[1] + '",' + '"level":' + Math.round(picker.xy[2] * 100) + '}';
      			var cmd = picker.xy[0] + ',' + picker.xy[1];
                              vis.setValue(cmd_id, cmd);
      			vis.setValue(level_id, Math.round(picker.xy[2] * 254));
                          }
                      });
      

      Vielen Dank,
      Artur

      1 Reply Last reply
      0
      • ? A Former User

        Vorstellung:

        Nach langer Suche habe ich den vis-colorpicker umgeändert,
        damit dieser auch DeConz Geräte per CIE-Farbraum (x,y) steuern kann.

        Problem: Meine Mueller Licht Tint Serie unterstützt keinen RGB/HUE Wert.
        Mit einem einfachen Handgriff könnt ihr den HUE Colorpicker demnächst auch im Kombination mit CIE Lampen nutzen.

        Workaround:

        1. Öffnet die Datei: /opt/iobroker/node_modules/iobroker.vis-colorpicker/widgets/colorpicker.html

        Ersetzt Zeile 483 mit folgender:

        var cmd = picker.xy[0] + ',' + picker.xy[1];
        

        Hier einmal der Vergleich alt gegen neu:

        handler.push(function () {
                            if (cmd_id !== 'nothing_selected') {
                                // ALTE ZEILE
                                // var cmd = '{"transitiontime":' + data.transitionTime + ',"xy":"' + picker.xy[0] + ',' + picker.xy[1] + '",' + '"level":' + Math.round(picker.xy[2] * 100) + '}';
                                // NEUE ZEILE
        			var cmd = picker.xy[0] + ',' + picker.xy[1];
                                vis.setValue(cmd_id, cmd);
                            }
                        });
        
        1. Startet die Instanz "vis.x" (zb: vis.0) neu.

        2. Konfiguriert den Hue ColorPicker folgendermaßen:

        huecolorpicker.PNG

        Und fertig ist der neue Colorpicker.

        Viel Spaß

        curryhoden

        D Offline
        D Offline
        dibide
        wrote on last edited by
        #4

        @curryhoden said in Tutorial: Vis-colorpicker CIE Color (x,y):

        Öffnet die Datei: /opt/iobroker/node_modules/iobroker.vis-colorpicker/widgets/colorpicker.html

        Ersetzt Zeile 483 mit folgender:

        Hi,

        kannst Du einem DAU wie mir mal genauer erzählen was Du mit

        Öffnet die Datei: /opt/iobroker/node_modules/iobroker.vis-colorpicker/widgets/colorpicker.html
        

        meinst? :grinning:

        Wie/wo kann ich die Datei öffnen?

        crunchipC 1 Reply Last reply
        0
        • D dibide

          @curryhoden said in Tutorial: Vis-colorpicker CIE Color (x,y):

          Öffnet die Datei: /opt/iobroker/node_modules/iobroker.vis-colorpicker/widgets/colorpicker.html

          Ersetzt Zeile 483 mit folgender:

          Hi,

          kannst Du einem DAU wie mir mal genauer erzählen was Du mit

          Öffnet die Datei: /opt/iobroker/node_modules/iobroker.vis-colorpicker/widgets/colorpicker.html
          

          meinst? :grinning:

          Wie/wo kann ich die Datei öffnen?

          crunchipC Away
          crunchipC Away
          crunchip
          Forum Testing Most Active
          wrote on last edited by
          #5

          @dibide

          • du loggst dich z.b. mit WinSCP auf deinen IoBroker,
            gehst in das entsprechende Verzeichnis und kannst dann die Datei editieren(gegebenenfalls noch Nodepad++ installieren).
          • oder einfach im Terminal mit
          nano /opt/iobroker/node_modules/iobroker.vis-colorpicker/widgets/colorpicker.html
          

          jedoch werden dir da keine Zeilennummern angezeigt

          umgestiegen von Proxmox auf Unraid

          D 1 Reply Last reply
          0
          • crunchipC crunchip

            @dibide

            • du loggst dich z.b. mit WinSCP auf deinen IoBroker,
              gehst in das entsprechende Verzeichnis und kannst dann die Datei editieren(gegebenenfalls noch Nodepad++ installieren).
            • oder einfach im Terminal mit
            nano /opt/iobroker/node_modules/iobroker.vis-colorpicker/widgets/colorpicker.html
            

            jedoch werden dir da keine Zeilennummern angezeigt

            D Offline
            D Offline
            dibide
            wrote on last edited by
            #6

            @crunchip
            Vielen Dank! Das hat mir sehr geholfen!:handshake:

            1 Reply Last reply
            0
            • X Offline
              X Offline
              xbow42
              wrote on last edited by
              #7

              Hallo,
              ich habe eine HueGo am Deconzstick angelernt und colorpicker.html angepasst.
              So ganz zufrieden bin ich damit aber noch nicht.

              • Wenn das Widget mal ein Update bekommen sollte, wird vermutlich die eigenen Anpassung wieder gelöscht.
              • ich kann jetzt einen Farbwert auswählen, und die Lampe schaltet auf diesen Wert immer mit voller Helligkeit um. Komisch, das Fadenkreuz spring im Auswahlfeld immer auf die Stelle s. Bild Der Helligkeitregler dimmt dann zwar aber eben nur gelb.
                iobroker-huego1.png
                DP hue kann ich manuell setzen ohne dass die Helligkeit bri verstellt wird. Welches colorWidget könnte man dafür nehmen und wie ist das einzustellen?

              An der HueGo kann ich durch drücken des Tasters die Farbmodi durchschalten leider bekomme ich außer den geänderten Werten in den Objekten nicht die Modus angezeigt. Hatte gehofft das der DB effect(string) dafür da ist.
              Hab auch schon mal ein paar Texte bei effect eingetragen aber keine Reaktion an der Lampe.


              müssten diese Farbmodi sein: getestet "Daylight" "daylight" leider ohne Erfolg.
              Daylight - Bright white.
              Soft white - Pinkish-yellow light, dimmer than Daylight but still bright enough to light a dark room.
              Cozy Candle - Dynamic dim orange hues that flicker.
              Sunday Coffee - Dynamic pink and orange hues that change every few seconds.
              Meditation - Dynamic blue hues that subtly change to blue-green.
              Enchanted Forest - Dynamic green hues that subtly change to yellow-green.
              Night Adventure - Dynamic purple and pink hues that change every few seconds.

              hier mal die DP:
              iobroker-huego2.png
              Wie geht das mit dem ansteuern der Farbmodi?

              1 Reply Last reply
              0
              • A Offline
                A Offline
                a_m_n_l
                wrote on last edited by
                #8

                Hi,

                das mit dem Springen des Helligkeitsreglers liegt an einem Umrechnungsfehler, ein paar Zeilen weiter unten. Nachdem ich Zeile 497 folgendermaßen angepasst habe, hat es bei mir funktioniert:

                picker.fromXY(parseFloat(xy[0]), parseFloat(xy[1]), parseInt(level) / 254);

                1 Reply Last reply
                0
                • X Offline
                  X Offline
                  xbow42
                  wrote on last edited by
                  #9

                  schon besser, aber es spring bei mir immer noch zum gelben Punkt.
                  könnte mit vorstellen das es mit dem dimspeed oder colorloopspeed zusammenhängt.

                  1 Reply Last reply
                  0
                  • E Offline
                    E Offline
                    exico66
                    wrote on last edited by
                    #10

                    Bei mir das Gleiche. Kreuz springt auf Gelb und ich kann nur die Helligkeit regeln. Habt Ihr eine Lösung gefunden?

                    NUC5i5RYH 12GB Ram, 120GB SSD, 1TB Sata, Conbee 3
                    Debian 10.2.0 amd64, Proxmox 6.1-1,

                    diverse Hue, Osram smart, alles was Zigbee kann und ein paar Groove

                    Für jede Hilfe dankbar

                    T 1 Reply Last reply
                    0
                    • E exico66

                      Bei mir das Gleiche. Kreuz springt auf Gelb und ich kann nur die Helligkeit regeln. Habt Ihr eine Lösung gefunden?

                      T Offline
                      T Offline
                      Tirador
                      wrote on last edited by
                      #11

                      @exico66 hast du alle Änderungen in der Datei durchgeführt die vorher gepostet würden? Bei mir läuft es damit einwandfrei. Müsste nur iobroker neustarten, damit die Änderungen greifen.

                      E 1 Reply Last reply
                      0
                      • T Tirador

                        @exico66 hast du alle Änderungen in der Datei durchgeführt die vorher gepostet würden? Bei mir läuft es damit einwandfrei. Müsste nur iobroker neustarten, damit die Änderungen greifen.

                        E Offline
                        E Offline
                        exico66
                        wrote on last edited by
                        #12

                        @Tirador ja, alle Änderungen durchgeführt und auch iobroker neu gestartet.

                        NUC5i5RYH 12GB Ram, 120GB SSD, 1TB Sata, Conbee 3
                        Debian 10.2.0 amd64, Proxmox 6.1-1,

                        diverse Hue, Osram smart, alles was Zigbee kann und ein paar Groove

                        Für jede Hilfe dankbar

                        T 1 Reply Last reply
                        0
                        • E exico66

                          @Tirador ja, alle Änderungen durchgeführt und auch iobroker neu gestartet.

                          T Offline
                          T Offline
                          Tirador
                          wrote on last edited by
                          #13

                          @exico66 ich habe das Verhalten bei mir noch einmal beobachtet. Generell funktioniert es gut bei mir, wenn man gezielt nur einen Datenpunkt für die Farbauswahl wählt. Ich habe auch das springen wenn man im colorpicker wischt, mit dem Finger auf dem Tablet. Ich denke das ist erklärbar, da dann wahrscheinlich kontinuierlich Werte gesendet und wieder durch das Widget empfangen werden. Dabei kommt es zu einer Verzögerung denke ich.

                          E 1 Reply Last reply
                          0
                          • T Tirador

                            @exico66 ich habe das Verhalten bei mir noch einmal beobachtet. Generell funktioniert es gut bei mir, wenn man gezielt nur einen Datenpunkt für die Farbauswahl wählt. Ich habe auch das springen wenn man im colorpicker wischt, mit dem Finger auf dem Tablet. Ich denke das ist erklärbar, da dann wahrscheinlich kontinuierlich Werte gesendet und wieder durch das Widget empfangen werden. Dabei kommt es zu einer Verzögerung denke ich.

                            E Offline
                            E Offline
                            exico66
                            wrote on last edited by
                            #14

                            @Tirador bei mir stellt es sich anders dar. wenn ich mit der mouse gezielt einen farbpunkt auswähle, dann ist es genau so. die lampe wird keine sichtbare ms mit der gewählten farbe geschaltet, sie wird sofort gelb. nur dimmen geht.

                            NUC5i5RYH 12GB Ram, 120GB SSD, 1TB Sata, Conbee 3
                            Debian 10.2.0 amd64, Proxmox 6.1-1,

                            diverse Hue, Osram smart, alles was Zigbee kann und ein paar Groove

                            Für jede Hilfe dankbar

                            T 1 Reply Last reply
                            0
                            • E exico66

                              @Tirador bei mir stellt es sich anders dar. wenn ich mit der mouse gezielt einen farbpunkt auswähle, dann ist es genau so. die lampe wird keine sichtbare ms mit der gewählten farbe geschaltet, sie wird sofort gelb. nur dimmen geht.

                              T Offline
                              T Offline
                              Tirador
                              wrote on last edited by
                              #15

                              @exico66
                              Ich habe das Verhalten nochmal beobachtet. Ich habe es nur beim ersten Mal das das Kreuz kurz auf gelb springt, aber im Anschluss auf den richtigen Farbwert.

                              Was für eine Lampe hast du denn? Ich nutze die Philips Hue Birnen.
                              Ich habe deconz in Version 1.2.6 im Einsatz. Ich bin außerdem auf der letzten Deconz Version 2.0.5.74.

                              1 Reply Last reply
                              0
                              • E Offline
                                E Offline
                                exico66
                                wrote on last edited by
                                #16

                                Du hast Recht, mit einer Hue hat es funktioniert. Bei Osram ging es nicht, teste aber weiter

                                NUC5i5RYH 12GB Ram, 120GB SSD, 1TB Sata, Conbee 3
                                Debian 10.2.0 amd64, Proxmox 6.1-1,

                                diverse Hue, Osram smart, alles was Zigbee kann und ein paar Groove

                                Für jede Hilfe dankbar

                                1 Reply Last reply
                                0
                                • E Offline
                                  E Offline
                                  exico66
                                  wrote on last edited by
                                  #17

                                  bei Osram sprimgt es, manchmal erst nach paar sekunden, immer zurück auf gelb. wenn du das noch fixen könntest ;-)
                                  danke

                                  NUC5i5RYH 12GB Ram, 120GB SSD, 1TB Sata, Conbee 3
                                  Debian 10.2.0 amd64, Proxmox 6.1-1,

                                  diverse Hue, Osram smart, alles was Zigbee kann und ein paar Groove

                                  Für jede Hilfe dankbar

                                  1 Reply Last reply
                                  0
                                  • B Offline
                                    B Offline
                                    BigStephan
                                    wrote on last edited by BigStephan
                                    #18

                                    Hey,

                                    meiner Meinung nach muss der Block so aussehen:

                                                    handler.push(function () {
                                                        if (cmd_id !== 'nothing_selected') {
                                                            
                                                            /*var cmd = picker.xy[0] + ',' + picker.xy[1]; (EDIT BEITRAG: Diese Zeile kann noch weg!)*/
                                                            vis.setValue(xy_id, picker.xy[0] + ',' + picker.xy[1]);
                                                            vis.setValue(level_id, Math.round(picker.xy[2] * 254));
                                                        }
                                                    });
                                    
                                                    var onChange = function () {
                                                        var xy = vis.states[xy_id + '.val'].toString();
                                                        var level = vis.states[level_id + '.val'] || 0;
                                                        xy = xy.split(',');
                                                        if (xy.length === 2) {
                                                            picker.fromXY(parseFloat(xy[0]), parseFloat(xy[1]), parseInt(level) / 254);
                                    
                                                        }
                                                    };
                                    
                                    
                                                    vis.states.bind(xy_id    + '.val', onChange);
                                                    vis.states.bind(level_id + '.val', onChange);
                                                    onChange();
                                    
                                    
                                    

                                    Scheinbar bekommt er bei der Abfrage des IST-Wertes aus Deconz nicht immer einen String sondern irgendetwas undefiniertes zurück und setzt deshalb zwischenzeitlich immer wieder auf "0.5,0.5" zurück. Wenn man das zwangscasted, gehts (zumindest bei mir springt er nun nicht mehr hin und her).

                                    Grüße

                                    Stephan

                                    T E 3 Replies Last reply
                                    2
                                    • B BigStephan

                                      Hey,

                                      meiner Meinung nach muss der Block so aussehen:

                                                      handler.push(function () {
                                                          if (cmd_id !== 'nothing_selected') {
                                                              
                                                              /*var cmd = picker.xy[0] + ',' + picker.xy[1]; (EDIT BEITRAG: Diese Zeile kann noch weg!)*/
                                                              vis.setValue(xy_id, picker.xy[0] + ',' + picker.xy[1]);
                                                              vis.setValue(level_id, Math.round(picker.xy[2] * 254));
                                                          }
                                                      });
                                      
                                                      var onChange = function () {
                                                          var xy = vis.states[xy_id + '.val'].toString();
                                                          var level = vis.states[level_id + '.val'] || 0;
                                                          xy = xy.split(',');
                                                          if (xy.length === 2) {
                                                              picker.fromXY(parseFloat(xy[0]), parseFloat(xy[1]), parseInt(level) / 254);
                                      
                                                          }
                                                      };
                                      
                                      
                                                      vis.states.bind(xy_id    + '.val', onChange);
                                                      vis.states.bind(level_id + '.val', onChange);
                                                      onChange();
                                      
                                      
                                      

                                      Scheinbar bekommt er bei der Abfrage des IST-Wertes aus Deconz nicht immer einen String sondern irgendetwas undefiniertes zurück und setzt deshalb zwischenzeitlich immer wieder auf "0.5,0.5" zurück. Wenn man das zwangscasted, gehts (zumindest bei mir springt er nun nicht mehr hin und her).

                                      Grüße

                                      Stephan

                                      T Offline
                                      T Offline
                                      Tirador
                                      wrote on last edited by Tirador
                                      #19

                                      @BigStephan Danke für deine Änderung. Ich habe den Code mal übernommen. ich hatte nur initial manchmal, dass der Wert gesprungen ist. Ich werde berichten.

                                      1 Reply Last reply
                                      0
                                      • B Offline
                                        B Offline
                                        BigStephan
                                        wrote on last edited by
                                        #20

                                        Was mir aber absolut unlogisch vorkommt:

                                        Mache ich den Picker im Editor der Visu zum ersten mal auf, passt die aktuell real an der Lampe eingestellte Farbe und die Helligkeit mit dem Picker zusammen. Egal ob Seite neu geladen oder komplett neu gestartet.

                                        In der Visu später selbst, passt das beim ersten Öffnen des Pickers nicht....hier steht der Picker bei mir immer auf Blau (ganz unten links) und 100% Helligkeit. Schließe ich diesen und öffne ihn erneut oder wechsle die View zwischendurch behält er die Werte allerdings. Nur beim Neuladen der Seite fehlen sie.

                                        Im Code wird das onChange() einmal beim Scriptstart aufgerufen und sorgt dann dafür, dass offenbar beim ersten Öffnen im Editor die Werte aus Deconz geladen werden und der Picker gleich richtige Werte zeigt.
                                        Das wird aber in der Visu selbst nicht gemacht....

                                        Mir ist der Code an dieser Stelle zu hoch....hier müßten sich die Autoren mal zu äußern (@hobbyquaker, @Bluefox ) :-)

                                        Grüße

                                        Stephan

                                        E D 2 Replies Last reply
                                        0
                                        • B BigStephan

                                          Hey,

                                          meiner Meinung nach muss der Block so aussehen:

                                                          handler.push(function () {
                                                              if (cmd_id !== 'nothing_selected') {
                                                                  
                                                                  /*var cmd = picker.xy[0] + ',' + picker.xy[1]; (EDIT BEITRAG: Diese Zeile kann noch weg!)*/
                                                                  vis.setValue(xy_id, picker.xy[0] + ',' + picker.xy[1]);
                                                                  vis.setValue(level_id, Math.round(picker.xy[2] * 254));
                                                              }
                                                          });
                                          
                                                          var onChange = function () {
                                                              var xy = vis.states[xy_id + '.val'].toString();
                                                              var level = vis.states[level_id + '.val'] || 0;
                                                              xy = xy.split(',');
                                                              if (xy.length === 2) {
                                                                  picker.fromXY(parseFloat(xy[0]), parseFloat(xy[1]), parseInt(level) / 254);
                                          
                                                              }
                                                          };
                                          
                                          
                                                          vis.states.bind(xy_id    + '.val', onChange);
                                                          vis.states.bind(level_id + '.val', onChange);
                                                          onChange();
                                          
                                          
                                          

                                          Scheinbar bekommt er bei der Abfrage des IST-Wertes aus Deconz nicht immer einen String sondern irgendetwas undefiniertes zurück und setzt deshalb zwischenzeitlich immer wieder auf "0.5,0.5" zurück. Wenn man das zwangscasted, gehts (zumindest bei mir springt er nun nicht mehr hin und her).

                                          Grüße

                                          Stephan

                                          E Offline
                                          E Offline
                                          exico66
                                          wrote on last edited by
                                          #21

                                          @BigStephan Danke, das werde ich heute mal testen und berichten.

                                          NUC5i5RYH 12GB Ram, 120GB SSD, 1TB Sata, Conbee 3
                                          Debian 10.2.0 amd64, Proxmox 6.1-1,

                                          diverse Hue, Osram smart, alles was Zigbee kann und ein paar Groove

                                          Für jede Hilfe dankbar

                                          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

                                          709

                                          Online

                                          32.5k

                                          Users

                                          81.7k

                                          Topics

                                          1.3m

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

                                          • Don't have an account? Register

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