🌀 3D-Curl-Noise-Strömungsfeld
Tausende Partikel folgen einem 3D-Curl-Noise-Geschwindigkeitsfeld, das auf Canvas gerendert wird. Curl Noise (∇×F) ist quellenfrei, was zu glatt aussehenden turbulenten Strömungen ohne Senken führt.
So funktioniert es
Curl Noise wird durch Berechnung der Rotation (∇×F) eines 3D-Potential-Rauschfeldes abgeleitet. Die entscheidende mathematische Eigenschaft ist, dass die Divergenz jeder Rotation null ist (∇·(∇×F) = 0), wodurch das resultierende Geschwindigkeitsfeld quellenfrei wird. Das bedeutet, dass in der Strömung keine "Senken" oder "Quellen" existieren — die Partikeldichte bleibt überall erhalten.
In der Praxis tasten wir ein 3D-Perlin-/Simplex-Rauschfeld an leicht versetzten Positionen ab, um die für die Rotation benötigten partiellen Ableitungen numerisch anzunähern. Die z-Koordinate der Rauschabfrage schreitet langsam mit der Zeit voran und erzeugt so eine glatte zeitliche Entwicklung des 2D-Strömungsmusters.
velocity = (∂N(x,y,z)/∂y - ∂N(x,y+e,z)/∂x, ∂N(x+e,y,z)/∂x - ...)
z = time * 0.003 (langsame zeitliche Entwicklung)
Jedes Partikel speichert seine Position (px, py) und einen Lebensdauer-Zähler. Wenn ein Partikel die Leinwandgrenze verlässt oder seine Lebensdauer überschreitet, wird es an einer zufälligen Position neu ausgesät. Der Spuren-Verblassungseffekt wird erzielt, indem bei jedem Frame ein halbtransparentes schwarzes Rechteck darübergelegt wird, statt die Leinwand vollständig zu löschen.
Häufig gestellte Fragen
Was ist Curl Noise?
Curl Noise ist ein quellenfreies Vektorfeld, das durch Bildung der Rotation (∇×F) eines Potential-Rauschfeldes gewonnen wird. Da die Rotation jedes Vektorfeldes eine Divergenz von null hat, sammeln sich Partikel, die Curl Noise folgen, nie an und zerstreuen sich nie — sie fließen in geschlossenen oder offenen Bahnen ohne Senken oder Quellen.
Warum ist Curl Noise quellenfrei?
Nach der vektoranalytischen Identität ∇·(∇×F) = 0 für jedes glatte Vektorfeld F ist die Rotation stets quellenfrei. Diese mathematische Eigenschaft stellt sicher, dass das Strömungsfeld das "Volumen" erhält — es entstehen keine Ansammlungen von Partikeldichte, was auf natürliche Weise glatt aussehende turbulente Strömungen erzeugt.
Was ist ein Strömungsfeld in der generativen Kunst?
Ein Strömungsfeld ist ein Gitter von Vektoren, das Partikel über die Leinwand lenkt. Jedes Partikel liest den Vektor an seiner aktuellen Position ab und bewegt sich entlang davon. Wenn das zugrunde liegende Feld aus Rauschen (Perlin, Simplex oder Curl Noise) abgeleitet ist, entsteht organisch fließende, turbulent aussehende Kunst.
Was ist Perlin-Rauschen?
Perlin-Rauschen ist eine von Ken Perlin erfundene Gradientenrauschfunktion. Sie erzeugt glatt interpolierte pseudozufällige Werte und eignet sich damit ideal für natürlich aussehende Texturen, Gelände und Strömungsfelder. Die 3D-Version tastet Werte an drei Koordinaten (x, y, z) ab, sodass die Zeit als z-Achse kodiert werden kann.
Wie ermöglicht 3D-Rauschen zeitliche Animation?
Indem die Simulationszeit als dritte (z-)Koordinate der Rauschfunktion verwendet wird, entwickelt sich das Strömungsfeld glatt über die Zeit ohne abrupte Sprünge. Während z langsam zunimmt, verschiebt sich die 2D-Scheibe des 3D-Rauschfeldes organisch, sodass Partikel kontinuierlich zu driften und sich zu entwickeln scheinen.
Was ist der Unterschied zwischen Perlin- und Simplex-Rauschen?
Simplex-Rauschen ist Ken Perlins verbesserte Version des Perlin-Rauschens. Es verwendet ein Simplex-Gitter (Dreiecke in 2D, Tetraeder in 3D) statt eines quadratischen/kubischen Gitters. Dies eliminiert achsenausgerichtete Artefakte, hat eine bessere Rechenkomplexität O(n²) gegenüber O(2^n) in n Dimensionen und erzeugt isotropere Ergebnisse.
Wie viele Partikel können in Echtzeit laufen?
Auf einem modernen GPU-beschleunigten Browser-Canvas laufen typischerweise 3000–8000 Partikel bei 60 fps. Diese Simulation verwendet je nach Reglereinstellung 2000–6000 Partikel. Jedes Partikel benötigt eine Rauschauswertung und einen Canvas-Zeichenaufruf pro Frame, sodass die Leistung linear mit der Partikelanzahl skaliert.
Was ist die Spuren-Verblassungstechnik?
Statt die Leinwand bei jedem Frame zu löschen, wird ein halbtransparentes schwarzes Rechteck über die gesamte Leinwand gezeichnet. Dadurch verblassen alte Partikelpositionen allmählich und hinterlassen leuchtende Spuren, die die Struktur des Strömungsfeldes sichtbar machen. Die Deckkraft des Verblassungs-Rechtecks steuert die Spurenlänge.
Kann Curl Noise echte Strömungsdynamik simulieren?
Curl Noise ahmt das Erscheinungsbild turbulenter Fluidströmung nach, löst aber nicht die Navier-Stokes-Gleichungen. Echte Fluidsimulation erfordert das Lösen von PDEs mit Druckkorrektur. Curl Noise ist jedoch rechnerisch günstig, divergiert numerisch nie und erzeugt für Spiele und generative Kunst ästhetisch überzeugende Turbulenz.
Was ist Oktaven-Schichtung (fraktales Rauschen)?
Oktaven-Schichtung summiert mehrere Rauschfunktionen bei unterschiedlichen Frequenzen und Amplituden: W(x) = Σ (1/2^i)·noise(2^i·x). Jede weitere Oktave verdoppelt die Frequenz und halbiert die Amplitude, wodurch feinere Details hinzugefügt werden. Das Ergebnis ist fraktales Rauschen (fBm — fraktionale Brownsche Bewegung), das natürliche Phänomene wie Wolken und Gelände nachahmt.
Über diese Simulation
Jedes Partikel tastet an vier winzigen versetzten Punkten ein 3D-fraktales Rauschfeld ab, und curlAt() verwandelt diese endlichen Differenzen über ∂Fy/∂x − ∂Fx/∂y in eine Geschwindigkeit — die numerische Rotation des Rauschpotentials. Da eine Rotation mathematisch garantiert quellenfrei ist, sammeln sich Partikel nie in Senken an und verschwinden nie in Quellen, sondern wirbeln endlos, weshalb das Erhöhen von Oktaven immer feinere turbulente Details hinzufügt, ohne die Strömung jemals zu unterbrechen.
🔬 Was gezeigt wird
Tausende leuchtende Partikelspuren wirbeln durch eine glatte, quellenfreie turbulente Strömung, wobei sich das Muster langsam über die Zeit entwickelt, während die z-Koordinate des Rauschfeldes voranschreitet.
🎮 Bedienung
Passen Sie Partikel, Geschwindigkeit, Skala und Oktaven an, wählen Sie die Länge der Spuren-Verblassung und den Farbmodus, klicken Sie auf die Leinwand, um an dieser Stelle einen Schub neuer Partikel zu erzeugen, oder drücken Sie P/R zum Pausieren/Zurücksetzen.
💡 Wussten Sie schon?
Curl Noise ist ein beliebter Trick in visuellen Effekten und Spielen, gerade weil er numerisch nie "divergiert", wie es echte Fluidlöser können — man erhält überzeugende Turbulenz ohne das Instabilitätsrisiko beim Lösen der Navier-Stokes-Gleichungen.
Häufig gestellte Fragen
Warum ballen sich Partikel nie zusammen oder leeren einen Bereich?
Das Geschwindigkeitsfeld ergibt sich aus der Rotation eines Rauschpotentials, und die vektoranalytische Identität div(curl(F))=0 garantiert, dass die resultierende Strömung quellenfrei ist, sodass die Partikeldichte überall erhalten bleibt.
Was fügt eine Erhöhung der Oktaven der Strömung tatsächlich hinzu?
Die Funktion fbm() summiert für jede hinzugefügte Oktave zunehmend höherfrequente, niedrigamplitudigere Rauschschichten und schichtet feinere turbulente Details über die großräumigen Wirbel, ohne die Gesamtströmungsrichtung zu ändern.
Was passiert, wenn ich auf die Leinwand klicke?
Ein Klick erzeugt 200 frische Partikel, die in einem zufälligen Radius um den Cursor verstreut werden, wobei zunächst bestehende Partikel ersetzt werden, bevor neue hinzugefügt werden, sodass Sie einen sichtbaren Schub in die Strömung injizieren können.
Wie animiert die Simulation das Muster über die Zeit, ohne dass es immer gleich aussieht?
Die Simulationszeit fließt in die z-Koordinate der 3D-Rauschabfrage ein, sodass jeder Frame eine leicht andere Scheibe durch das Rauschvolumen abtastet, was zu glatter, kontinuierlicher Entwicklung statt eines statischen oder sich wiederholenden Musters führt.
Was ändert die Einstellung der Spuren-Verblassung tatsächlich?
Statt die Leinwand zu löschen, wird bei jedem Frame ein halbtransparentes schwarzes Rechteck über alles gezeichnet; eine niedrigere Verblassungs-Deckkraft hinterlässt lange leuchtende Spuren, während eine höhere alte Positionen fast sofort löscht.
Tausende Partikel folgen einem 3D-Curl-Noise-Geschwindigkeitsfeld, das auf Canvas gerendert wird. Curl Noise (∇×F) ist quellenfrei, was zu glatt aussehenden turbulenten Strömungen ohne Senken führt.
3D · Three.js/WebGL-Renderer · Ziel 60 FPS · läuft vollständig clientseitig, keine Installation nötig