Code créatif et animation
Générateur de champs de points
Saisissez une expression mathématique et regardez-la se transformer […]
cseen
Une petite bibliothèque TypeScript, cseen, qui dessine des figures 3D en SVG à partir de coordonnées. Toutes les illustrations de ce site, y compris les animations, en sont issues. Elle est publiée sur npm sous le nom cseen.
Version réduite
Une version réduite du projet. La version complète est liée ci-dessous.
Comment ça marche
- 01Une scène est du code simple : boîtes, lignes, points, arcs et caméras placés avec x vers la droite, y vers la profondeur et z vers le haut. Une fonction de projection transforme ces coordonnées en positions écran, et un seul passage trié en profondeur les dessine en SVG.
- 02Chaque scène est une fonction du temps, donc l’image fixe d’une carte et l’animation dans le navigateur viennent du même code. Un cadrage fixe évite que l’image tremble pendant que les éléments bougent.
- 03Les 17 figures de ce site sont ici, dessinées en direct par cseen. Choisissez-en une, faites glisser le curseur de temps et téléchargez le SVG.
Plus dans cette catégorie