CanvasRenderingContext2D.lineTo()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

La méthode CanvasRenderingContext2D.lineTo() de l'API Canvas 2D connecte le dernier point du sous-chemin en cours aux coordonnées x, y spécifiées avec une ligne droite (sans tracer réellement le chemin).

Syntaxe

js
void ctx.lineTo(x, y);

Paramètres

x

L'abscisse x du point d'arrivée.

y

L'ordonnée y du point d'arrivée.

Exemples

Utilisation de la méthode lineTo

Ceci est un extrait de code utilisant la méthode lineTo. Il faut utiliser la méthode beginPath() pour débuter un dessin, pour ensuite pouvoir dessiner une ligne dessus. On peut déplacer le crayon avec la méthode moveTo() et utiliser la méthode stroke() pour rendre la ligne visible.

HTML

html
<canvas id="canvas"></canvas>

JavaScript

js
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");

ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(100, 100);
ctx.stroke();

Éditez le code suivant pour voir les changements en direct:

Code jouable

Spécifications

Specification
HTML Standard
# dom-context-2d-lineto-dev

Compatibilité des navigateurs

BCD tables only load in the browser

Voir aussi