🏃🏽 Premiers pas⚓︎

Le but de ce site est de faire des dessins. Tout simplement.

Mais avant d'être Léonard, commençons par apprendre les bases !

Les instructions⚓︎

Nous allons dessiner en utilisant la programmation avec le langage Python 🐍.

Pour cela il va falloir saisir des instructions et demander à Python de les exécuter.

Attention

Python n'est pas intelligent comme vous : il arrête de lire à la première erreur ou faute d'orthographe. Il faut donc faire très attention à ce que l'on tape.

Sans trop s'inquiéter tout de même, la pire chose qui puisse arriver est d'obtenir un bug 🐛 !

Ci-dessous se trouve une fenêtre de programmation. Elle contient déjà des instructions.

Question

Cliquez sur le bouton "Lancer" afin d'afficher la figure.

Cela peut prendre un peu de temps lors de la première exécution...

###

# --- HDR ---#bksl-nlfrom js import document # pour l'insertion de l'image dans le htmlbksl-nlfrom math import cos, sin, radiansbksl-nlbksl-nltry:bksl-nl import drawSvg as drawbksl-nlexcept ImportError:bksl-nl # Import de drawSvgbksl-nl import pyodidepy-undjsbksl-nlbksl-nl await pyodidepy-undjs.loadPackage("micropip")bksl-nl import micropipbksl-nlbksl-nl await micropip.install("drawsvg==2.0.2")bksl-nlbksl-nl # Fonctions de desinbksl-nl import drawsvg as drawbksl-nlbksl-nlbksl-nldef affiche():bksl-nl division = document.getElementById(divpy-unddessin)bksl-nl division.innerHTML = py-undfigure.aspy-undsvg()bksl-nlbksl-nlbksl-nldef nouveaupy-unddessin(largeur, hauteur):bksl-nl global py-undfigurebksl-nl py-undfigure = draw.Drawing(bksl-nl largeur,bksl-nl hauteur,bksl-nl origin="center",bksl-nl viewbox=(-largeur // 2, -hauteur // 2, largeur, hauteur),bksl-nl )bksl-nlbksl-nlbksl-nldef couleurpy-undtrait(couleur):bksl-nl """bksl-nl Change la couleur du traitbksl-nl La couleur est une chaîne et de caractère et peut être:bksl-nl - en texte (en anglais)bksl-nl - en rgb(r, g, b)bksl-nl - en hexadécimal (au format str)bksl-nl """bksl-nl py-undsvgArgs["stroke"] = couleurbksl-nlbksl-nlbksl-nldef largeurpy-undtrait(largeur):bksl-nl """bksl-nl Change la largeur du traitbksl-nl La largeur est un entier positifbksl-nl """bksl-nl py-undsvgArgs["strokepy-undwidth"] = largeurbksl-nlbksl-nlbksl-nldef couleurpy-undcoloriage(couleur):bksl-nl """bksl-nl Change la couleur du coloriagebksl-nl La couleur est une chaîne et de caractère et peut être:bksl-nl - en texte (en anglais)bksl-nl - en rgb(r, g, b)bksl-nl - en hexadécimal (au format str)bksl-nl """bksl-nl py-undsvgArgs["fill"] = couleurbksl-nlbksl-nlbksl-nldef ligne(xpy-unddebut, ypy-unddebut, xpy-undfin, ypy-undfin):bksl-nl """bksl-nl Ajoute la ligne à la figurebksl-nl """bksl-nl py-undfigure.append(draw.Line(xpy-unddebut, -ypy-unddebut, xpy-undfin, -ypy-undfin, py-strpy-strpy-undsvgArgs))bksl-nlbksl-nlbksl-nldef lignes(py-strpoints):bksl-nl """bksl-nl Ajoute la ligne polygonale à la figurebksl-nl On fournit une liste de coordonnées de points [x1, y1, x2, y2, ...]bksl-nl """bksl-nl if len(points) % 2 == 1:bksl-nl raise ValueError("Il faut un nombre pair de coordonnées")bksl-nl pointspy-und = [(-1)py-strpy-stri py-str v for i, v in enumerate(points)]bksl-nl py-undfigure.append(draw.Lines(py-strpointspy-und, py-strpy-strpy-undsvgArgs))bksl-nlbksl-nlbksl-nldef rectangle(xpy-unddebut, ypy-unddebut, largeur, hauteur):bksl-nl """bksl-nl Ajoute le rectangle à la figurebksl-nl """bksl-nl py-undfigure.append(draw.Rectangle(xpy-unddebut, -ypy-unddebut - hauteur, largeur, hauteur, py-strpy-strpy-undsvgArgs))bksl-nlbksl-nlbksl-nldef cercle(xpy-undcentre, ypy-undcentre, rayon):bksl-nl """bksl-nl Ajoute le cercle à la figurebksl-nl """bksl-nl py-undfigure.append(draw.Circle(xpy-undcentre, -ypy-undcentre, rayon, py-strpy-strpy-undsvgArgs))bksl-nlbksl-nlbksl-nldef arc(xpy-undcentre, ypy-undcentre, rayon, anglepy-unddebut, anglepy-undfin):bksl-nl """bksl-nl Ajoute un arc de cercle à la figurebksl-nl """bksl-nl py-undfigure.append(draw.Arc(xpy-undcentre, -ypy-undcentre, rayon, -anglepy-unddebut, -anglepy-undfin, py-strpy-strpy-undsvgArgs))bksl-nlbksl-nlbksl-nldef courbe(xpy-unddebut, ypy-unddebut, xpy-undcontrolepy-und1, ypy-undcontrolepy-und1, xpy-undcontrolepy-und2, ypy-undcontrolepy-und2, xpy-undfin, ypy-undfin):bksl-nl """bksl-nl Ajoute une courbe (de Bézier) entre (xpy-unddebut, ypy-unddebut) et (xpy-undfin, ypy-undfin)bksl-nl Les points de contrôles permettent de paramétrer la courburebksl-nl """bksl-nl courbepy-undbezier = draw.Path(py-strpy-strpy-undsvgArgs)bksl-nl courbepy-undbezier.M(xpy-unddebut, -ypy-unddebut)bksl-nl courbepy-undbezier.C(xpy-undcontrolepy-und1, -ypy-undcontrolepy-und1, xpy-undcontrolepy-und2, -ypy-undcontrolepy-und2, xpy-undfin, -ypy-undfin)bksl-nl py-undfigure.append(courbepy-undbezier)bksl-nlbksl-nlbksl-nldef texte(contenu, x, y, taille):bksl-nl """bksl-nl Ajoute le texte 'contenu' à la position (x, y) et à la taille donnéebksl-nl """bksl-nl py-undfigure.append(draw.Text(contenu, taille, x, -y, py-strpy-strpy-undsvgArgs))bksl-nlbksl-nlbksl-nldef sauvegardepy-undSVG(nom):bksl-nl """bksl-nl Sauvegarde le fichier au format svg dans le dossier courantbksl-nl L'extension "svg" est ajoutée automatiquementbksl-nl figure.sauvegarde("image") crée, ou modifie, le fichier image.svgbksl-nl """bksl-nl py-undfigure.saveSvg(nom + ".svg")bksl-nlbksl-nlbksl-nldef sauvegardepy-undPNG(nom):bksl-nl """bksl-nl Sauvegarde le fichier au format png dans le dossier courantbksl-nl L'extension "png" est ajoutée automatiquementbksl-nl figure.sauvegarde("image") crée, ou modifie, le fichier image.pngbksl-nl """bksl-nl py-undfigure.savePng(nom + ".png")bksl-nlbksl-nlbksl-nldef enpy-undtexte():bksl-nl """bksl-nl Renvoie le contenu html de la figurebksl-nl """bksl-nl return py-undfigure.aspy-undsvg()bksl-nlbksl-nlbksl-nldef avance(pixels):bksl-nl """Avance et trace un trait long de "pixels" px"""bksl-nl nouveaupy-undx = py-undx + pixels py-str cos(radians(py-undangle))bksl-nl nouveaupy-undy = py-undy + pixels py-str sin(radians(py-undangle))bksl-nl ligne(py-undx, py-undy, nouveaupy-undx, nouveaupy-undy)bksl-nl globals()["py-undx"] = nouveaupy-undxbksl-nl globals()["py-undy"] = nouveaupy-undybksl-nl if py-undmodepy-undcoloriage:bksl-nl globals()["py-undpoints"].extend([py-undx, py-undy])bksl-nlbksl-nlbksl-nldef gauche(degres):bksl-nl """Tourne à gauche de "degres" degrés"""bksl-nl globals()["py-undangle"] += degresbksl-nlbksl-nlbksl-nldef droite(degres):bksl-nl """Tourne à droite de "degres" degrés"""bksl-nl globals()["py-undangle"] -= degresbksl-nlbksl-nlbksl-nlbksl-nldef saute(x, y):bksl-nl """Amène ne crayon à la position x, y SANS DESSINER"""bksl-nl globals()["py-undx"] = xbksl-nl globals()["py-undy"] = -ybksl-nl if py-undmodepy-undcoloriage:bksl-nl globals()["py-undpoints"].extend([py-undx, py-undy])bksl-nlbksl-nlbksl-nldef debutpy-undcoloriage():bksl-nl """Débute une séquence de coloriage avec la tortue"""bksl-nl globals()["py-undmodepy-undcoloriage"] = Truebksl-nl globals()["py-undpoints"] = [py-undx, py-undy]bksl-nlbksl-nlbksl-nldef finpy-undcoloriage():bksl-nl """Termine une séquence de coloriage avec la tortue"""bksl-nl anciennepy-undcouleur = py-undsvgArgs["stroke"]bksl-nl py-undsvgArgs["stroke"] = "transparent"bksl-nl lignes(py-strpy-undpoints)bksl-nl py-undsvgArgs["stroke"] = anciennepy-undcouleurbksl-nl globals()["py-undmodepy-undcoloriage"] = Falsebksl-nlbksl-nlbksl-nlpy-undfigure = Nonebksl-nlpy-undsvgArgs = {"strokepy-undwidth": 1, "stroke": "black", "fill": "white"}bksl-nlpy-undx = 0bksl-nlpy-undy = 0bksl-nlpy-undpoints = []bksl-nlpy-undangle = 0bksl-nlpy-undmodepy-undcoloriage = Falsebksl-nlbksl-nlbksl-nldivpy-unddessin = "figure"bksl-nl# --- HDR ---#bksl-nlbksl-nlnouveaupy-unddessin(400, 300) # l'image fait 400 de large et 300 de hautbksl-nlcouleurpy-undtrait("red")bksl-nlcouleurpy-undcoloriage("blue")bksl-nlrectangle(0, 0, 100, 40) # le coin BG du rectangle est au centre de la figure et fait 100 sur 40bksl-nlaffiche() # Indispensable !bksl-nlbksl-nl

A

Z

Votre image sera ici !

D'autres couleurs

Modifiez le code afin que le rectangle soit colorié en rouge et ait une bordure bleue.

Solution

Il faut saisir les noms des couleurs en anglais ! Vous pouvez aller chercher leur nom sur cette page.

🐍 Script Python

nouveau_dessin(400, 300)
couleur_trait("blue")
couleur_coloriage("red")
rectangle(0, 0, 100, 40)
affiche()

Rectangle ➞ Carré

Dessinez un carré jaune.

Solution

Un carré est un rectangle aussi large que haut non ?

🐍 Script Python

nouveau_dessin(400, 300)
couleur_coloriage("yellow")
rectangle(0, 0, 100, 100)
affiche()

Carré²

Dessinez deux carrés sur le même dessin :

un petit jaune,
un grand violet.

Solution

Il faut changer la couleur entre les deux dessins. On change aussi la coordonnée du coin en bas à gauche.

🐍 Script Python

nouveau_dessin(400, 300)
couleur_coloriage("yellow")
rectangle(-50, -50, 50, 50)
couleur_coloriage("purple")
rectangle(0, 0, 100, 100)
affiche()

Les coordonnées⚓︎

Il est facile de se repérer dans la figure, il suffit de fournir deux nombres x et y (les « matheux » disent abscisse et ordonnée) :

la coordonnée x désigne la position horizontale (de gauche à droite),
la coordonnée y désigne la position verticale (de bas en haut),
le point de coordonnées x = 0 et y = 0 est ... au centre de la figure !

Le repère

Hors-champ

Si la figure fait 500 pixels de large, comme le repère est centré au milieu, cela signifie que l'on peut dessiner entre -250 et 250.

Si l'on sort de la figure, les pixels ne sont pas affichés...

Entraînons-nous sur ces coordonnées en introduisant une nouvelle instruction : la ligne.

Tracer une ligne

Trace un segment sur la figure.

Il faut fournir quatre paramètres :

x_debut : l'abscisse du point de départ ;
y_debut : l'ordonnée du point de départ ;
x_fin : l'abscisse du point d'arrivée ;
y_fin : l'ordonnée du point de départ.

On peut régler la largeur du trait ou sa couleur.

Par exemple, ligne(-30, 50, 20, 10) trace une ligne depuis le point de coordonnées x = -30 et y = 50 vers celui de coordonnées = 20 et y = 10.

Diagonales

On donne une figure de 600 pixels de large et 400 de haut.

Tracer en rouge et avec un épaisseur de 5 pixels les deux diagonales de l'image.

Coup de pouce

Le coin en haut à gauche de l'image a pour coordonnées \((-300~;~200)\). Le coin en bas à droite \((300~;~-200)\).

le tracé de la diagonale correspondante se fait donc en saisissant l'instruction ligne(-300, 200, 300, -200).

Solution

🐍 Script Python

nouveau_dessin(600, 400)
couleur_trait("red")
largeur_trait(5)
ligne(-300, 200, 300, -200)
ligne(-300, -200, 300, 7200)
affiche()

###

# --- HDR ---#bksl-nlfrom js import document # pour l'insertion de l'image dans le htmlbksl-nlfrom math import cos, sin, radiansbksl-nlbksl-nltry:bksl-nl import drawSvg as drawbksl-nlexcept ImportError:bksl-nl # Import de drawSvgbksl-nl import pyodidepy-undjsbksl-nlbksl-nl await pyodidepy-undjs.loadPackage("micropip")bksl-nl import micropipbksl-nlbksl-nl await micropip.install("drawsvg==2.0.2")bksl-nlbksl-nl # Fonctions de desinbksl-nl import drawsvg as drawbksl-nlbksl-nlbksl-nldef affiche():bksl-nl division = document.getElementById(divpy-unddessin)bksl-nl division.innerHTML = py-undfigure.aspy-undsvg()bksl-nlbksl-nlbksl-nldef nouveaupy-unddessin(largeur, hauteur):bksl-nl global py-undfigurebksl-nl py-undfigure = draw.Drawing(bksl-nl largeur,bksl-nl hauteur,bksl-nl origin="center",bksl-nl viewbox=(-largeur // 2, -hauteur // 2, largeur, hauteur),bksl-nl )bksl-nlbksl-nlbksl-nldef couleurpy-undtrait(couleur):bksl-nl """bksl-nl Change la couleur du traitbksl-nl La couleur est une chaîne et de caractère et peut être:bksl-nl - en texte (en anglais)bksl-nl - en rgb(r, g, b)bksl-nl - en hexadécimal (au format str)bksl-nl """bksl-nl py-undsvgArgs["stroke"] = couleurbksl-nlbksl-nlbksl-nldef largeurpy-undtrait(largeur):bksl-nl """bksl-nl Change la largeur du traitbksl-nl La largeur est un entier positifbksl-nl """bksl-nl py-undsvgArgs["strokepy-undwidth"] = largeurbksl-nlbksl-nlbksl-nldef couleurpy-undcoloriage(couleur):bksl-nl """bksl-nl Change la couleur du coloriagebksl-nl La couleur est une chaîne et de caractère et peut être:bksl-nl - en texte (en anglais)bksl-nl - en rgb(r, g, b)bksl-nl - en hexadécimal (au format str)bksl-nl """bksl-nl py-undsvgArgs["fill"] = couleurbksl-nlbksl-nlbksl-nldef ligne(xpy-unddebut, ypy-unddebut, xpy-undfin, ypy-undfin):bksl-nl """bksl-nl Ajoute la ligne à la figurebksl-nl """bksl-nl py-undfigure.append(draw.Line(xpy-unddebut, -ypy-unddebut, xpy-undfin, -ypy-undfin, py-strpy-strpy-undsvgArgs))bksl-nlbksl-nlbksl-nldef lignes(py-strpoints):bksl-nl """bksl-nl Ajoute la ligne polygonale à la figurebksl-nl On fournit une liste de coordonnées de points [x1, y1, x2, y2, ...]bksl-nl """bksl-nl if len(points) % 2 == 1:bksl-nl raise ValueError("Il faut un nombre pair de coordonnées")bksl-nl pointspy-und = [(-1)py-strpy-stri py-str v for i, v in enumerate(points)]bksl-nl py-undfigure.append(draw.Lines(py-strpointspy-und, py-strpy-strpy-undsvgArgs))bksl-nlbksl-nlbksl-nldef rectangle(xpy-unddebut, ypy-unddebut, largeur, hauteur):bksl-nl """bksl-nl Ajoute le rectangle à la figurebksl-nl """bksl-nl py-undfigure.append(draw.Rectangle(xpy-unddebut, -ypy-unddebut - hauteur, largeur, hauteur, py-strpy-strpy-undsvgArgs))bksl-nlbksl-nlbksl-nldef cercle(xpy-undcentre, ypy-undcentre, rayon):bksl-nl """bksl-nl Ajoute le cercle à la figurebksl-nl """bksl-nl py-undfigure.append(draw.Circle(xpy-undcentre, -ypy-undcentre, rayon, py-strpy-strpy-undsvgArgs))bksl-nlbksl-nlbksl-nldef arc(xpy-undcentre, ypy-undcentre, rayon, anglepy-unddebut, anglepy-undfin):bksl-nl """bksl-nl Ajoute un arc de cercle à la figurebksl-nl """bksl-nl py-undfigure.append(draw.Arc(xpy-undcentre, -ypy-undcentre, rayon, -anglepy-unddebut, -anglepy-undfin, py-strpy-strpy-undsvgArgs))bksl-nlbksl-nlbksl-nldef courbe(xpy-unddebut, ypy-unddebut, xpy-undcontrolepy-und1, ypy-undcontrolepy-und1, xpy-undcontrolepy-und2, ypy-undcontrolepy-und2, xpy-undfin, ypy-undfin):bksl-nl """bksl-nl Ajoute une courbe (de Bézier) entre (xpy-unddebut, ypy-unddebut) et (xpy-undfin, ypy-undfin)bksl-nl Les points de contrôles permettent de paramétrer la courburebksl-nl """bksl-nl courbepy-undbezier = draw.Path(py-strpy-strpy-undsvgArgs)bksl-nl courbepy-undbezier.M(xpy-unddebut, -ypy-unddebut)bksl-nl courbepy-undbezier.C(xpy-undcontrolepy-und1, -ypy-undcontrolepy-und1, xpy-undcontrolepy-und2, -ypy-undcontrolepy-und2, xpy-undfin, -ypy-undfin)bksl-nl py-undfigure.append(courbepy-undbezier)bksl-nlbksl-nlbksl-nldef texte(contenu, x, y, taille):bksl-nl """bksl-nl Ajoute le texte 'contenu' à la position (x, y) et à la taille donnéebksl-nl """bksl-nl py-undfigure.append(draw.Text(contenu, taille, x, -y, py-strpy-strpy-undsvgArgs))bksl-nlbksl-nlbksl-nldef sauvegardepy-undSVG(nom):bksl-nl """bksl-nl Sauvegarde le fichier au format svg dans le dossier courantbksl-nl L'extension "svg" est ajoutée automatiquementbksl-nl figure.sauvegarde("image") crée, ou modifie, le fichier image.svgbksl-nl """bksl-nl py-undfigure.saveSvg(nom + ".svg")bksl-nlbksl-nlbksl-nldef sauvegardepy-undPNG(nom):bksl-nl """bksl-nl Sauvegarde le fichier au format png dans le dossier courantbksl-nl L'extension "png" est ajoutée automatiquementbksl-nl figure.sauvegarde("image") crée, ou modifie, le fichier image.pngbksl-nl """bksl-nl py-undfigure.savePng(nom + ".png")bksl-nlbksl-nlbksl-nldef enpy-undtexte():bksl-nl """bksl-nl Renvoie le contenu html de la figurebksl-nl """bksl-nl return py-undfigure.aspy-undsvg()bksl-nlbksl-nlbksl-nldef avance(pixels):bksl-nl """Avance et trace un trait long de "pixels" px"""bksl-nl nouveaupy-undx = py-undx + pixels py-str cos(radians(py-undangle))bksl-nl nouveaupy-undy = py-undy + pixels py-str sin(radians(py-undangle))bksl-nl ligne(py-undx, py-undy, nouveaupy-undx, nouveaupy-undy)bksl-nl globals()["py-undx"] = nouveaupy-undxbksl-nl globals()["py-undy"] = nouveaupy-undybksl-nl if py-undmodepy-undcoloriage:bksl-nl globals()["py-undpoints"].extend([py-undx, py-undy])bksl-nlbksl-nlbksl-nldef gauche(degres):bksl-nl """Tourne à gauche de "degres" degrés"""bksl-nl globals()["py-undangle"] += degresbksl-nlbksl-nlbksl-nldef droite(degres):bksl-nl """Tourne à droite de "degres" degrés"""bksl-nl globals()["py-undangle"] -= degresbksl-nlbksl-nlbksl-nlbksl-nldef saute(x, y):bksl-nl """Amène ne crayon à la position x, y SANS DESSINER"""bksl-nl globals()["py-undx"] = xbksl-nl globals()["py-undy"] = -ybksl-nl if py-undmodepy-undcoloriage:bksl-nl globals()["py-undpoints"].extend([py-undx, py-undy])bksl-nlbksl-nlbksl-nldef debutpy-undcoloriage():bksl-nl """Débute une séquence de coloriage avec la tortue"""bksl-nl globals()["py-undmodepy-undcoloriage"] = Truebksl-nl globals()["py-undpoints"] = [py-undx, py-undy]bksl-nlbksl-nlbksl-nldef finpy-undcoloriage():bksl-nl """Termine une séquence de coloriage avec la tortue"""bksl-nl anciennepy-undcouleur = py-undsvgArgs["stroke"]bksl-nl py-undsvgArgs["stroke"] = "transparent"bksl-nl lignes(py-strpy-undpoints)bksl-nl py-undsvgArgs["stroke"] = anciennepy-undcouleurbksl-nl globals()["py-undmodepy-undcoloriage"] = Falsebksl-nlbksl-nlbksl-nlpy-undfigure = Nonebksl-nlpy-undsvgArgs = {"strokepy-undwidth": 1, "stroke": "black", "fill": "white"}bksl-nlpy-undx = 0bksl-nlpy-undy = 0bksl-nlpy-undpoints = []bksl-nlpy-undangle = 0bksl-nlpy-undmodepy-undcoloriage = Falsebksl-nlbksl-nldivpy-unddessin = "coordonnees"bksl-nl# --- HDR ---#bksl-nlnouveaupy-unddessin(600, 400)bksl-nlcouleurpy-undtrait(...)bksl-nllargeurpy-undtrait(5)bksl-nlbksl-nlaffiche()bksl-nlbksl-nl

A

Z

Votre image sera ici !

Échelle

Pouvez-vous dessiner une échelle ?

L'image doit faire 50 pixels de large et 700 de haut.

Le trait de l'échelle fait 5 pixels de large et il est marron.

L'échelle est debout, les barreaux font 50 pixels de large et ils sont placés tous les 75 pixels en partant du bas de l'image.

Bien entendu, il n'y pas de barreau au sol !

Solution

🐍 Script Python

nouveau_dessin(50, 700)
couleur_trait("brown")
largeur_trait(5)
ligne(-25, -350, -25, 350)
ligne(25, -350, 25, 350)
ligne(-25, -275, 25, -275)
ligne(-25, -200, 25, -200)
ligne(-25, -125, 25, -125)
ligne(-25, -50, 25, -50)
ligne(-25, 25, 25, 25)
ligne(-25, 100, 25, 100)
ligne(-25, 175, 25, 175)
ligne(-25, 250, 25, 250)
ligne(-25, 325, 25, 325)
affiche()

Maison 🏠

Pouvez-vous dessiner une maison ?

Cette fois-ci, vous avez carte blanche : votre maison peut être carré ou rectangulaire, avec un toit plat ou à deux pentes... Vous êtes l'architecte !

On fournit une nouvelle instructions pour vous aider : les lignes. Cela peut être pratique pour dessiner un toit colorié !

Tracer des lignes

Trace une suite de segments sur la figure.

Il faut fournir les coordonnées x et y des différents points, à la suite les uns des autres.

Si l'on a réglé la couleur de coloriage, la zone entourée par les lignes est coloriée.

Par exemple, lignes(-30, 50, 20, 10, 100, 30) trace la ligne :

partant de -30, 50,
passant par 20, 10,
se terminant en 100, 30.