Visualisation Starfield en JavaScript

Il s'agit d'une implémentation simple et directe d'une visualisation qui rappelle l'économiseur d'écran Starfield classique de Windows 95.

Il est également interactif : vous pouvez toucher l'écran ou utiliser l'accéléromètre pour influencer la direction du mouvement.

Voici comment ça marche :

• Créez un groupe de particules (100), chacune dans une position aléatoire.
• À chaque image, éloignez chaque particule du centre*. Plus la particule est éloignée du centre, plus elle devient visible. Cela donne l'illusion que les particules se rapprochent du spectateur, ou que le spectateur s'éloigne plus loin dans l'espace.
• Le centre n'est pas vraiment le centre de l'écran, mais un point variable qui peut être influencé par l'utilisateur en déplaçant son curseur ou en inclinant son appareil.
• Lorsque les particules sortent de la vue, placez-les à nouveau près du centre, cela permet à la visualisation de continuer à perpétuité.

Dans cet article de blog, je souhaite partager le code source très commenté pour démontrer à quel point il est simple de créer des animations visuellement attrayantes avec quelques lignes de code et des connaissances mathématiques de base.

Veuillez cliquer ici pour voir la visualisation en action !

Le code est disponible dans ce Gist :

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!