Canvas lineCap eigenschap

Definitie en gebruik

lineCap Eigenschap instellen of retourneren van de stijl van de lijnpuntkap aan het einde van de lijn.

Note:"round"En "square"Maakt de lijn iets langer."

Voorbeeld

Teken een afgeronde lijnpuntkap:

Uw browser ondersteunt de canvas tag niet.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.lineCap="round";
ctx.moveTo(20,20);
ctx.lineTo(20,200);
ctx.stroke();

Probeer het zelf uit

Syntax

context.lineCap="butt|round|square";

Eigenschapswaarde

Waarde Beschrijving
butt Standaard. Voeg een rechte rand toe aan elk uiteinde van de lijn.
round Voeg een cirkelvormige lijnpuntkap toe aan elk uiteinde van de lijn.
square Add square line caps to each end of the line.

Technical details

Default value: butt

Browser support

The numbers in the table indicate the first browser version that fully supports this property.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

Note:Internet Explorer 8 and earlier versions do not support the <canvas> element.