Starfield-Visualisierung in JavaScript

Dies ist eine einfache, unkomplizierte Implementierung einer Visualisierung, die an den klassischen Windows 95-Sternenfeld-Bildschirmschoner erinnert.

Es ist auch interaktiv: Sie können den Bildschirm berühren oder den Beschleunigungsmesser verwenden, um die Richtung der Bewegung zu beeinflussen.

So funktioniert es:

• Erstellen Sie eine Reihe von Partikeln (100), jeweils an einer zufälligen Position.
• Bewegen Sie jedes Partikel in jedem Frame weiter weg von der Mitte*. Je weiter das Teilchen vom Zentrum entfernt ist, desto sichtbarer wird es. Dadurch entsteht die Illusion, dass die Partikel näher an den Betrachter heranrücken oder dass der Betrachter weiter in den Weltraum vordringt.
• Die Mitte ist nicht wirklich die Mitte des Bildschirms, sondern ein variabler Punkt, den der Benutzer beeinflussen kann, indem er seinen Cursor bewegt oder sein Gerät neigt.
• Wenn die Partikel die Sicht verlassen, platzieren Sie sie wieder in der Nähe der Mitte. Dadurch bleibt die Visualisierung dauerhaft bestehen.

In diesem Blogbeitrag möchte ich den viel kommentierten Quellcode teilen, um zu zeigen, wie einfach es ist, mit ein paar Codezeilen und grundlegenden Mathematikkenntnissen optisch ansprechende Animationen zu erstellen.

Bitte klicken Sie hier, um die Visualisierung in Aktion zu sehen!

Der Code ist in diesem Gist verfügbar:

Das obige ist der detaillierte Inhalt vonStarfield-Visualisierung in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!