HTML 参考手册

HTML 标签大全

HTML: <template> balise

HTML canvas stroke() 方法

HTML canvas的stroke()方法用于绘制路径。使用moveTo()和lineTo()方法绘制此路径。

Manuel de référence HTML canvas

在线示例

绘制一条路径，形状是蓝色的字母 L再画一条竖线：

JavaScript：

示例

!DOCTYPE　html>
<html>
<head>
<meta　charset="utf-8">
<title>HTML　canvas　stroke()方法使用-基础教程(oldtoolbag.com)</title>
</head>
<body>
<canvas　id="myCanvas"　width="300"　height="150"　style="border:1px　solid　#d3d3d3>
您的浏览器不支持　HTML5　canvas　标签。
</canvas>
<script>
var　c=document.getElementById("myCanvas");
var　ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.lineTo(20,100);
ctx.lineTo(70,100);
ctx.strokeStyle="blue";
ctx.stroke();
ctx.beginPath();
ctx.moveTo(100,　200);
ctx.lineTo(100,　100);
ctx.strokeStyle = "blue";
ctx.stroke();
</script>　
</body>
</html>

Vérifiez et voyez ‹/›

Compatibilité du navigateur

IEFirefoxOperaChromeSafari

Internet Explorer 9et Firefox, Opera, Chrome et Safari supportent stroke() méthode.

Remarque :Internet Explorer 8 Les versions précédentes de <canvas> ne sont pas supportées.

Définition et utilisation

La méthode stroke() dessine effectivement le chemin défini par moveTo() et lineTo(). La couleur par défaut est noire.

Avis :Utilisez strokeStyle Utiliser une propriété pour dessiner une autre couleur/Dégradé.

Syntaxe JavaScript :	contexte.stroke();

Manuel de référence HTML canvas

HTML: <template> balise