Μέθοδος stroke
Η μέθοδος stroke καλείται για να ολοκληρώσει
τη σχεδίαση μιας γραμμής με τη βοήθεια του lineTo,
καθώς και για περγράμμιση περιγράμματος σχημάτων που σχεδιάστηκαν,
για παράδειγμα, μέσω της μεθόδου rect.
Σύνταξη
context.stroke()
Παράδειγμα
Ας σχεδιάσουμε μια γραμμή:
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(150, 50);
ctx.stroke();
:
Παράδειγμα
Ας σχεδιάσουμε ένα τετράγωνο:
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(150, 50);
ctx.lineTo(150, 150);
ctx.lineTo(50, 150);
ctx.closePath();
ctx.stroke();
:
Δείτε επίσης
-
μέθοδος
fill,
που χρησιμοποιείται για γέμισμα του σχήματος με φόντο -
ιδιότητα
strokeStyle,
που ορίζει το χρώμα της γραμμής
