Comment sont décrites les courbes de Bézier dans les fichiers SVG

Cette page explique comment les courbes de Bézier sont décrites dans les chemins des fichiers SVG.

Points d'ancrage et points de contrôle

Une section de courbe de Bézier est décrite par 4 points :

2 points d'ancrage (également appelés points de passage ou point terminaux) : ils décrivent les coordonnées du point initial et du point finale de la courbe ou section de courbe ;
2 points de contrôle : ils définissent la direction de la courbe à chaque point d'ancrage.

Dans les illustrations suivantes, les points P1 et P4 sont les points d'ancrage. Les points P2 et P3 sont les points de contrôle.

Dans les chemins SVG, les commandes M et C sont utilisées pour décrire des courbes de Bézier :

La commande M (move to) est suivi par un seul point (P1) et décrit le premier point d'ancrage (point de départ).
La commande C (curve) est suivie par trois points (P2, P3 et P4) et dérit la courbe (points de contrôle et point final)

M x1 y1
C x2 y2     x3 y3       x4 y4

Les exemples suivants sont tirés du site w3.org:

Dernière mise à jour : 13/04/2019