为了账号安全,请及时绑定邮箱和手机立即绑定

正在回答

1 回答

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>七巧板</title>
		<style>
			
		</style>
	</head>
	<body>			
			<canvas id="canvas"  style="display:block;border:1px solid #aaa;margin:50px auto;">
				当前浏览器不支持canvas,请更换浏览器后再试!
			</canvas>
			<script type="text/javascript">
				var site=[
				{p:[{x:0,y:0},{x:400,y:400},{x:0,y:800}],color:"#e67817"},
				{p:[{x:0,y:0},{x:400,y:0},{x:200,y:200}],color:"#f09ba0"},
				{p:[{x:400,y:0},{x:600,y:200},{x:400,y:400},{x:200,y:200}],color:"#fff500"},
				{p:[{x:400,y:0},{x:800,y:0},{x:800,y:400}],color:"#d22d2b"},
				{p:[{x:600,y:200},{x:600,y:600},{x:400,y:400}],color:"#76c5f0"},
				{p:[{x:600,y:200},{x:800,y:400},{x:800,y:800},{x:600,y:600}],color:"#6600a1"},
				{p:[{x:400,y:400},{x:800,y:800},{x:0,y:800}],color:"#00923f"}
				];
				
				window.onload=function(){					
					var canvas=document.getElementById('canvas');
					canvas.width=800;
					canvas.height=800;
					var context=canvas.getContext('2d');
					for(var i=0;i<site.length;i++){				
						draw(site[i],context);	
					}					
					
					function draw(sitt,ctx){				
						ctx.beginPath();
						ctx.moveTo(sitt.p[0].x,sitt.p[0].y);
						for(var i=1;i<sitt.p.length;i++){	
							ctx.lineTo(sitt.p[i].x,sitt.p[i].y);	
						}
						ctx.closePath();	
						ctx.fillStyle=sitt.color;
						ctx.fill();					
						//ctx.strokeStyle="black";
						//ctx.stroke();						
					}																			
				}	
			</script>
	</body>
</html>


0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

七巧板怎么不给源码呢

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信