HTML5之Canvas画圆形

最新推荐文章于 2024-08-16 18:48:55 发布

翱翔天地

最新推荐文章于 2024-08-16 18:48:55 发布

阅读量3.6k

点赞数 1

分类专栏： HTML5 文章标签： html5 canvas

本文链接：https://blog.csdn.net/you23hai45/article/details/44263177

版权

本文介绍了如何使用HTML5的Canvas API来绘制圆形，详细解析了创建路径、建立圆形路径、关闭路径和设定填充样式的步骤，并提供了关键代码示例。

摘要由CSDN通过智能技术生成

HTML5之Canvas画圆形

1、设计源码

<!DOCTYPE html>
<head>
<meta charset="utf-8" />
<title>HTML5之Canvas画圆形</title>

</head>
<body onLoad="drawFour('canvas')">
   <canvas id="canvas" width="1200" height="560"/>
   <script type="text/javascript">
		var canvas=document.getElementById("canvas");
		var context=canvas.getContext("2d");
		context.fillStyle="#0000ff";
		context.beginPath();
		context.arc(600,300,200,0,Math.PI*2,true);
		context.closePath();
		context.fill();
	</script>
</body>