Glossaire

Vecteur

Un vecteur représente une direction et une magnitude dans l'espace. En 3D :

$$\overrightarrow{v}=(x,y,z)$$

La magnitude (longueur) du vecteur :

$$\parallel \overrightarrow{v}\parallel =\sqrt{x^2+y^2+z^2}$$

Un vecteur normalisé a une magnitude de 1 :

$$\hat{v}=\frac{\overrightarrow{v}}{\parallel \overrightarrow{v}\parallel }$$

Scalaire

Un scalaire est une valeur numérique simple, sans direction. Il peut multiplier un vecteur pour changer sa magnitude :

$$k\cdot \overrightarrow{v}=(k\cdot x,k\cdot y,k\cdot z)$$

Matrice

Une matrice 4×4 est utilisée en 3D pour représenter des transformations (translation, rotation, échelle). En Three.js, Matrix4 est omniprésente :

$$M=\left(\begin{array}{cccc}{m}_{00}& m_{01}& m_{02}& m_{03}\\ m_{10}& m_{11}& m_{12}& m_{13}\\ m_{20}& m_{21}& m_{22}& m_{23}\\ m_{30}& m_{31}& m_{32}& m_{33}\end{array}\right)$$

Angles d'Euler

Les angles d'Euler décomposent une rotation 3D en trois rotations successives autour des axes $X$, $Y$, $Z$ (respectivement pitch, yaw, roll) :

$$R=R_Z(\psi )\cdot R_Y(\theta )\cdot R_X(\varphi )$$

avec $\varphi \in [-180°,180°]$, $\theta \in [-90°,90°]$, $\psi \in [-180°,180°]$.

C'est la représentation la plus intuitive, mais l'ordre des rotations compte ($R_X\cdot R_Y\ne R_Y\cdot R_X$), et elle souffre du gimbal lock : lorsque $\theta =\pm 90°$, les axes $X$ et $Z$ s'alignent et on perd un degré de liberté.

Quaternion

Un quaternion représente une rotation dans l'espace 3D sans souffrir du blocage de cardan (gimbal lock). Il est composé d'une partie scalaire et d'un vecteur :

$$q=(w,x,y,z)\text{avec}{w}^2+x^2+y^2+z^2=1$$

Une rotation d'angle $\theta$ autour d'un axe unitaire $\hat{u}=(u_x,u_y,u_z)$ s'encode :

$$q=(\cos \frac{\theta }{2},u_x\sin \frac{\theta }{2},u_y\sin \frac{\theta }{2},u_z\sin \frac{\theta }{2})$$

Normale

Un vecteur normal est un vecteur perpendiculaire à une surface en un point donné. Il est unitaire par convention :

$$\hat{n}=\frac{\overrightarrow{a}\times \overrightarrow{b}}{\parallel \overrightarrow{a}\times \overrightarrow{b}\parallel }$$

où $\overrightarrow{a}$ et $\overrightarrow{b}$ sont deux arêtes du triangle. Les normales sont indispensables pour le calcul de l'éclairage et les réponses aux collisions.

Rayon

Un rayon est une demi-droite définie par une origine $\overrightarrow{o}$ et une direction $\hat{d}$ (unitaire). Tout point du rayon s'écrit :

$$\overrightarrow{r}(t)=\overrightarrow{o}+t\cdot \hat{d}(t\ge 0)$$

Utilisé pour le raycasting : détecter ce que vise le curseur, les tirs, la ligne de vue.

AABB

Une Axis-Aligned Bounding Box est une boîte de collision dont les faces sont parallèles aux axes du repère. Elle se définit par deux points :

$$\text{AABB}=({\overrightarrow{p}}_{min},{\overrightarrow{p}}_{max})\text{avec}{\overrightarrow{p}}_{min}=(x_{min},y_{min},z_{min})$$

Un point $\overrightarrow{p}$ est à l'intérieur si :

$$x_{min}\le p_x\le x_{max}\wedge y_{min}\le p_y\le y_{max}\wedge z_{min}\le p_z\le z_{max}$$

UV

Les coordonnées UV sont des coordonnées 2D $(u,v)\in [0,1{]}^2$ qui associent chaque sommet d'un maillage à un point d'une texture :

$$\text{couleur}(u,v)=\text{texture}[u\cdot W,v\cdot H]$$

où $W$ et $H$ sont les dimensions en pixels de la texture. $u$ correspond à l'axe horizontal, $v$ à l'axe vertical.

Opérations

Vectorielle

Dot product

Le produit scalaire (dot product) de deux vecteurs donne un scalaire. Il mesure à quel point deux vecteurs sont alignés :

$$\overrightarrow{a}\cdot \overrightarrow{b}=a_x{b}_x+a_y{b}_y+a_z{b}_z=\parallel \overrightarrow{a}\parallel \parallel \overrightarrow{b}\parallel \cos \theta$$

• Si $\overrightarrow{a}\cdot \overrightarrow{b}=0$ : les vecteurs sont perpendiculaires
• Si $\overrightarrow{a}\cdot \overrightarrow{b}>0$ : ils pointent dans le même sens
• Si $\overrightarrow{a}\cdot \overrightarrow{b}<0$ : ils pointent en sens opposé

Cross product

Le produit vectoriel (cross product) de deux vecteurs donne un vecteur perpendiculaire aux deux :

$$\overrightarrow{a}\times \overrightarrow{b}=\left(\begin{array}{c}{a}_y{b}_z-a_z{b}_y\\ a_z{b}_x-a_x{b}_z\\ a_x{b}_y-a_y{b}_x\end{array}\right)$$

Sa magnitude vaut $\parallel \overrightarrow{a}\parallel \parallel \overrightarrow{b}\parallel \sin \theta$. Utilisé notamment pour calculer les normales de surfaces.

Matricielle

Multiplication matricielle

Appliquer une transformation $B$ puis $A$ à un vecteur $\overrightarrow{v}$ :

$${\overrightarrow{v}}^{\prime }=A\cdot B\cdot \overrightarrow{v}$$

L'ordre compte : $A\cdot B\ne B\cdot A$ en général.

Pour transformer un point, on multiplie la matrice par le vecteur colonne. En dimension $n$ :

$$\left(\begin{array}{c}{x}_1^{\prime }\\ x_2^{\prime }\\ ⋮\\ x_n^{\prime }\end{array}\right)=\left(\begin{array}{cccc}{m}_{11}& m_{12}& \cdots & m_{1n}\\ m_{21}& m_{22}& \cdots & m_{2n}\\ ⋮& & \ddots & ⋮\\ m_{n1}& m_{n2}& \cdots & m_{nn}\end{array}\right)\cdot \left(\begin{array}{c}{x}_1\\ x_2\\ ⋮\\ x_n\end{array}\right)$$

Chaque composante du résultat est la somme des produits de la ligne $i$ de $M$ avec le vecteur :

$$x_i^{\prime }=m_{i1}\cdot x_1+m_{i2}\cdot x_2+\cdots +m_{in}\cdot x_n=\sum _{j=1}^n{m}_{ij}\cdot x_j$$

En 3D homogène ($n=4$, avec $x_4=1$) :

$$\left(\begin{array}{c}{x}^{\prime }\\ y^{\prime }\\ z^{\prime }\\ 1\end{array}\right)=M\cdot \left(\begin{array}{c}x\\ y\\ z\\ 1\end{array}\right)$$$$x^{\prime }=m_{11}x+m_{12}y+m_{13}z+m_{14}$$$$y^{\prime }=m_{21}x+m_{22}y+m_{23}z+m_{24}$$$$z^{\prime }=m_{31}x+m_{32}y+m_{33}z+m_{34}$$

Transformation

Déplacer, tourner ou redimensionner un objet revient à lui appliquer une matrice. On distingue trois transformations fondamentales :

Translation d'un vecteur $\overrightarrow{t}=(t_x,t_y,t_z)$ :

$$T=\left(\begin{array}{cccc}1& 0& 0& t_x\\ 0& 1& 0& t_y\\ 0& 0& 1& t_z\\ 0& 0& 0& 1\end{array}\right)$$

Mise à l'échelle par facteurs $(s_x,s_y,s_z)$ :

$$S=\left(\begin{array}{cccc}{s}_x& 0& 0& 0\\ 0& s_y& 0& 0\\ 0& 0& s_z& 0\\ 0& 0& 0& 1\end{array}\right)$$

Rotation d'angle $\theta$ autour de l'axe $Z$ :

$$R_z=\left(\begin{array}{cccc}\cos \theta & -\sin \theta & 0& 0\\ \sin \theta & \cos \theta & 0& 0\\ 0& 0& 1& 0\\ 0& 0& 0& 1\end{array}\right)$$

La transformation complète d'un objet (modèle → monde) combine ces matrices :

$$M_{model}=T\cdot R\cdot S$$

Caméra

Projection perspective

La projection perspective transforme les coordonnées 3D en coordonnées 2D écran en simulant la perception humaine : les objets lointains paraissent plus petits. Elle est définie par :

• FOV (Field of View) : angle d'ouverture vertical $\alpha$
• Aspect ratio : rapport largeur/hauteur de l'écran $a=W/H$
• Near/Far : distances minimale $n$ et maximale $f$ du volume visible

Un point 3D $(x,y,z)$ est projeté en :

$$x_{écran}=\frac{x}{z\cdot \tan (\alpha /2)}{y}_{écran}=\frac{y}{z\cdot a\cdot \tan (\alpha /2)}$$

Physique

Forces

La force appliquée à un objet de masse $m$ produit une accélération $\overrightarrow{a}$ :

$$\overrightarrow{F}=m\cdot \overrightarrow{a}$$

Plusieurs forces peuvent s'additionner (gravité, vent, collisions…) :

$${\overrightarrow{F}}_{total}={\overrightarrow{F}}_1+{\overrightarrow{F}}_2+\cdots +{\overrightarrow{F}}_n$$

Position, vitesse, accélération

Ces trois grandeurs sont liées par la dérivation / intégration par rapport au temps $t$ :

$$\overrightarrow{a}(t)=\frac{d\overrightarrow{v}}{dt}$$$$\overrightarrow{v}(t)=\frac{d\overrightarrow{p}}{dt}$$$$\overrightarrow{a}(t)=\frac{d^2\overrightarrow{p}}{d{t}^2}$$$$\overrightarrow{v}(t)=\int \overrightarrow{a}dt\overrightarrow{p}(t)=\int \overrightarrow{v}dt$$

En simulation temps réel, on approxime avec un pas de temps $\mathrm{\Delta }t$ (méthode d'Euler) :

$${\overrightarrow{v}}_{n+1}={\overrightarrow{v}}_n+{\overrightarrow{a}}_n\cdot \mathrm{\Delta }t$$$${\overrightarrow{p}}_{n+1}={\overrightarrow{p}}_n+{\overrightarrow{v}}_{n+1}\cdot \mathrm{\Delta }t$$

Gravité et animation

Sous l'effet de la gravité seule ($g\approx 9.8{\text{m/s}}^2$), la hauteur à l'instant $t$ est :

$$p_y(t)=p_{y_0}+v_{y_0}\cdot t-\frac{1}{2}g\cdot t^2$$

En animation image par image, on met à jour la hauteur à chaque pas $\mathrm{\Delta }t$ :

$$v_{y_{n+1}}=v_{y_n}-g\cdot \mathrm{\Delta }t$$$$p_{y_{n+1}}=p_{y_n}+v_{y_{n+1}}\cdot \mathrm{\Delta }t$$