在屏幕中央绘制一个圆点

最新推荐文章于 2021-05-31 00:11:11 发布

sun-shadow

最新推荐文章于 2021-05-31 00:11:11 发布

阅读量756

点赞数

分类专栏： JavaScript 文章标签：圆点制图 2d canvas

本文链接：https://blog.csdn.net/u013494746/article/details/39431555

版权

JavaScript 专栏收录该内容

9 篇文章

订阅专栏

<html>
	<head>
		<style type="text/css">
			.canvas{
				background:#000;
				}
			</style>
		
		</head>
	<body>
		<canvas class="canvas" ></canvas>
			<script type="text/javascript">
				var S = {
					start: function(){
						Drawing.init();
						
						Drawing.drawDot(new Dot(5,20,25));
						}
					};
				Dot = function(x,y,z){
					this.x = x;
					this.y = y;
					this.z = z;
					this.h =1;
					};
				Drawing = (function(){
					var canvas,context;
					return {
						init: function(){
						canvas = document.querySelector('.canvas');
						context = canvas.getContext('2d');
						canvas.width = window.innerWidth;
						canvas.height = window.innerHeight;
						},
						drawDot: function(dot){
							context.fillStyle = '#fff';
							context.beginPath();
							context.arc(dot.x + canvas.width / 2,dot.y + canvas.height / 2,dot.z,0,2 * Math.PI,true);
							context.closePath();
							context.fill();
							}
						}
					}());
					S.start();
				</script>
		</body>
</html>