Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. [gelöst]animierter Schnee - mir fehlt der letzte Gedanke

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    [gelöst]animierter Schnee - mir fehlt der letzte Gedanke

    This topic has been deleted. Only users with topic management privileges can see it.
    • BananaJoe
      BananaJoe Most Active @holly200289 last edited by

      @holly200289 hast du denn auch die Bilder hinterlegt und die URLs angepasst?

      1 Reply Last reply Reply Quote 0
      • H
        holly200289 last edited by

        nein ich habe schon bei googel gesucht, aber noch nichts gefunden

        1 Reply Last reply Reply Quote 0
        • H
          holly200289 last edited by

          Da muss ich eine vorlage hinterlegen richtig, von dieser wird alles abgeleitet ?

          OliverIO 1 Reply Last reply Reply Quote 0
          • OliverIO
            OliverIO @holly200289 last edited by OliverIO

            @holly200289

            der thread ist zwar uralt, da aber dennoch wird nach einer lösung gefragt. hier für vis1

            Schritt 1:
            Skript von folgender Adresse kopieren
            und im Skriptreiter von vis eintragen/ergänzen
            https://www.go4u.de/files/javascript/snowflakes/snowflakes.js

            Schritt2:
            neues html widget platzieren

            Schritt3:
            folgende skripte in das html feld des html widgets eintragen.

            skript ohne bedingungen

            <script>
            snowflakes.start();
            </script>
            

            skript mit bedingungen

            ich habe hier mal 2 datenpunkte gewählt, anhand deren dann bedingt das skript gestartet oder
            das skript ist nun auf datenpunkte vom typ number eingestellt.
            wer bspw string datenpunkte einfügen möchte, muss um den binding ausdruck noch anführungszeichen machen. der binding ausdruck ist sozusagen als platzhalter zu sehen, an deren stelle dann der reale wert nackt eingetragen wird. im ergebnis muss gültiges javascript herauskommen, sonst funktioniert es nicht. mit F12/Console kann nach fehler gescuht werden.
            eine schleife ist ebenfalls nicht ntwendig, da das skript voll automatisch bei jeder dp änderung aufgerufen wird und die aktualisierten werte eingetragen werden.

            <script>
            let t1 = {0_userdata.0.t1};
            let t2 = {0_userdata.0.t2};
            if (t1>10 && t2>10) {
                snowflakes.start();
            } else {
                snowflakes.stop();
            }
            </script>
            
            H Chaot 3 Replies Last reply Reply Quote 0
            • H
              holly200289 @OliverIO last edited by

              @oliverio Super vielen dank das funktioniert schonmal super

              1 Reply Last reply Reply Quote 0
              • H
                holly200289 @OliverIO last edited by

                @oliverio Könnte ich das auch mit der Temperatur koppeln ?

                Chaot OliverIO 2 Replies Last reply Reply Quote 0
                • Chaot
                  Chaot @OliverIO last edited by Chaot

                  @oliverio Danke für die Erklärung.
                  Eine Frage hätte ich noch

                  Die Schneeflocken kommen bei mir nur auf dem Hintergrund. Ich habe den Z-Index des Html Widgets auf 50 gesetzt und immer noch den gleichen Effekt. Gibt es da einen Trick?

                  Edit:
                  In deinem Temperaturscript ist ein kleiner Fehler:

                  <script>
                  let t1 = {0_userdata.0.t1};
                  let t2 = {0_userdata.0.t2};
                  if (t1<10 && t2<10) {
                      snowflakes.start();
                  } else {
                      snowflakes.stop();
                  }
                  </script>
                  

                  Es soll ja vermutlich bei Temperaturern UNTER 10°C auslösen (Zeile 4)

                  OliverIO 2 Replies Last reply Reply Quote 0
                  • Chaot
                    Chaot @holly200289 last edited by Chaot

                    @holly200289 Siehe das letzte script.
                    Den oder die Datenpunkte auswählen und anstelle von

                    0_userdata.0.t1
                    

                    bzw. t2 dann deinen Datenpunkt eintragen.
                    In Zeile 4 dann deine Auslösetemperatur eintragen (10° ist bischen warm für Schnee)

                    Bei nur einem Datenpunkt sollte es dann theoretisch so funktionieren:

                    <script>
                    let t1 = {sonoff.0.BLE_Sensoren.xxxxxxx_Temperature};
                    
                    if (t1<4) {
                        snowflakes.start();
                    } else {
                        snowflakes.stop();
                    }
                    </script>
                    
                    BananaJoe 1 Reply Last reply Reply Quote 0
                    • OliverIO
                      OliverIO @holly200289 last edited by

                      @holly200289 sagte in [gelöst]animierter Schnee - mir fehlt der letzte Gedanke:

                      Könnte ich das auch mit der Temperatur koppeln ?

                      ja, du musst dann anhand des beispiels mit bedingungen nur deine temperatur aus dem datenpunkt auslesen und in der logik ggfs mit anpassen.

                      1 Reply Last reply Reply Quote 0
                      • OliverIO
                        OliverIO @Chaot last edited by

                        @chaot sagte in [gelöst]animierter Schnee - mir fehlt der letzte Gedanke:

                        In deinem Temperaturscript ist ein kleiner Fehler

                        du hast t mit temperatur interpretiert?
                        die logik war nur beispielhaft. ich gehe davon aus, das die logik (größer als, kleiner als) überschaubar ist und das jeder selbst dann so anpassen kann wie man will

                        1 Reply Last reply Reply Quote 0
                        • OliverIO
                          OliverIO @Chaot last edited by

                          @chaot sagte in [gelöst]animierter Schnee - mir fehlt der letzte Gedanke:

                          Die Schneeflocken kommen bei mir nur auf dem Hintergrund. Ich habe den Z-Index des Html Widgets auf 50 gesetzt und immer noch den gleichen Effekt. Gibt es da einen Trick?

                          ich habe mir mal den code angeschaut. die schneeflocken hängen nicht von den Einstellungen des widgets ab. sie werden dynamisch erzeugt und in das html eingefügt.

                          du kannst im folgenden bereich die zeile mit dem zindex ergänzen

                          		// init flake
                          		s = f.el.style;
                          		s.transform = 'translate(0, -' + f.size + 'px)';
                          		s.color = randomItemFromArray(config.color);
                          		s.family = randomItemFromArray(config.fontType);
                          		s.fontSize = f.size + 'px';
                          		s.zIndex = 100;
                          
                          
                          Chaot 1 Reply Last reply Reply Quote 0
                          • Chaot
                            Chaot @OliverIO last edited by

                            @oliverio sagte in [gelöst]animierter Schnee - mir fehlt der letzte Gedanke:

                            s.zIndex = 100;

                            Danke das wars.
                            Ich war etwas irritiert, weil oben in Zeile 60 bereits ein Z-Index eingetragen ist. aber jetzt funktioniert ja alles so wie ich mir das wünsche. Ganz herzlichen Dank.

                            OliverIO 1 Reply Last reply Reply Quote 0
                            • OliverIO
                              OliverIO @Chaot last edited by

                              @chaot sagte in [gelöst]animierter Schnee - mir fehlt der letzte Gedanke:

                              war etwas irritiert, weil oben in Zeile 60 bereits ein Z-Index

                              du meinst in den uralt-posts?
                              da stehen 2 scripts, einmal von bluefox ein jquery plugin und eine alte version von diesem snowflakes skipt. die habe ich gar nicht probiert, sonder eine aktualisierte version des snowflakes skript gefunden.

                              Chaot 1 Reply Last reply Reply Quote 0
                              • Chaot
                                Chaot @OliverIO last edited by

                                @oliverio
                                Nein, ich meinte schon das Script aus dem von dir geposteten Link.

                                // start snow
                                	function start(userConfig)
                                	{
                                		if (running)
                                			return;
                                
                                		running = true;
                                		config = mergeObjects(userConfig || {}, defaultConfig);
                                		resize();
                                
                                		// add new flakes
                                		while (config.amount > flakes.length)
                                			createFlake(flakes.length);
                                
                                		// init snowflakes
                                		if (!initialized)
                                		{
                                			initialized = true;
                                			window.addEventListener('resize', resize);
                                
                                			let style = document.createElement('style');
                                			style.innerHTML = '.js-anim-snowflake { user-select: none; position: absolute; left: 0; top: 0; zIndex: 20000; }';
                                			document.getElementsByTagName('head')[0].appendChild(style);
                                
                                			lastInterval = time();
                                			window.requestAnimationFrame(move);
                                		}
                                

                                (hier Zeile 22)

                                OliverIO 1 Reply Last reply Reply Quote 0
                                • OliverIO
                                  OliverIO @Chaot last edited by

                                  @chaot

                                  ahja,
                                  das geht auch, allerdings hat der author hier die javascript-schreibweise verwendet, die falsch ist.
                                  bei css-Anweisungen muss man "z-index" verwenden
                                  https://developer.mozilla.org/de/docs/Web/CSS/z-index

                                  Chaot 1 Reply Last reply Reply Quote 0
                                  • Chaot
                                    Chaot @OliverIO last edited by

                                    @oliverio Ah, ok. Daher die verwirrung meinerseits.
                                    Aber mit deiner Änderung funktioniert das jetzt wie gewünscht.
                                    Bei der Gelegenheit noch gemerkt, dass mein zweiter Außensensor scheinbar seit Heiligabend ausgefallen ist. Man hat ja sonst Langeweile....

                                    OliverIO 1 Reply Last reply Reply Quote 0
                                    • OliverIO
                                      OliverIO @Chaot last edited by OliverIO

                                      @chaot sagte in [gelöst]animierter Schnee - mir fehlt der letzte Gedanke:

                                      ausgefallen

                                      kannst ja auf internet temperatur umstellen temporär

                                      1 Reply Last reply Reply Quote 1
                                      • BananaJoe
                                        BananaJoe Most Active @Chaot last edited by

                                        @chaot sagte in [gelöst]animierter Schnee - mir fehlt der letzte Gedanke:

                                        @holly200289 Siehe das letzte script.
                                        Den oder die Datenpunkte auswählen und anstelle von

                                        0_userdata.0.t1
                                        

                                        bzw. t2 dann deinen Datenpunkt eintragen.
                                        In Zeile 4 dann deine Auslösetemperatur eintragen (10° ist bischen warm für Schnee)

                                        Bei nur einem Datenpunkt sollte es dann theoretisch so funktionieren:

                                        <script>
                                        let t1 = {sonoff.0.BLE_Sensoren.xxxxxxx_Temperature};
                                        
                                        if (t1<4) {
                                            snowflakes.start();
                                        } else {
                                            snowflakes.stop();
                                        }
                                        </script>
                                        

                                        wird das dann nicht nur einmal beim laden der VIS geprüft?

                                        1 Reply Last reply Reply Quote 0
                                        • icebear
                                          icebear last edited by

                                          Funktioniert das auch mit vis-2 ?

                                          1 Reply Last reply Reply Quote 0
                                          • First post
                                            Last post

                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          947
                                          Online

                                          31.9k
                                          Users

                                          80.1k
                                          Topics

                                          1.3m
                                          Posts

                                          10
                                          37
                                          4228
                                          Loading More Posts
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                          The ioBroker Community 2014-2023
                                          logo