Méthode : CanvasRenderingContext2D.beginPath()

Initialise un tracé de ligne dans le contexte du canvas

Syntaxe
myContext.beginPath()

Compatible tous navigateurs

Oui

Description
Initialise un nouveau tracé de ligne dans le contexte du canvas pour permettre de dessiner des formes avec lineTo() ou arc() par exemple.

Exemple 1 : Chemin aléatoire dans le canvas

Code source

<canvas id="myCanvas"></canvas>
<script type="text/javascript">
var myCanvas=document.getElementById("myCanvas");
var myContext=myCanvas.getContext("2d");

myContext.beginPath();
myContext.moveTo(150,100);
for (var i=1; i<=10; i++) {
var x=parseInt(300*Math.random());
var y=parseInt(150*Math.random());
console.log("Point : "+x+" , "+y);
myContext.lineTo(x, y);
}
myContext.stroke();

</script>

Résultat

Emulation de la console

Explication

Trace 10 lignes aléatoires dans le canvas.

Page en rapport
Le tutoriel sur le dessin avec canvas

Page mise à jour le 20/09/2017