canva基础学习（一）

最新推荐文章于 2024-05-14 18:35:24 发布

何烨坪Echo

最新推荐文章于 2024-05-14 18:35:24 发布

阅读量849

点赞数

分类专栏： js canvas学习

本文链接：https://blog.csdn.net/heye13/article/details/51490832

版权

本文介绍了使用Canva进行基础图形绘制，特别是如何通过修改函数参数轻松创建不同形状和旋转角度的矩形，展示了Canva的灵活性。

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

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<canvas id="canvas" style="border: 1px solid #aaa;display: block;margin: 50px auto;">
			你当前的浏览器不支持canvas，请更换浏览器再试。
		</canvas>
		
		<script>
			
			window.onload = function(){
				var canvas = document.getElementById("canvas");
				
				canvas.width = 800;
				canvas.height = 800;
				
				var context = canvas.getContext("2d");
				
				context.lineWidth = 50;
				context.strokeStyle = "#005588";
				
				context.beginPath();
				context.moveTo(100,200);
				context.lineTo(700,200);
				context.lineCap = "butt";
				context.stroke();
				
				cont