h5 canvas 贴图

在h5 canvas中贴图通常需要经过以下步骤：

创建一个Image对象，用于加载要贴图的图片。
在Image对象的onload事件中，获取图片的宽度和高度，并将图片绘制到canvas中。
使用canvas的drawImage方法将图片绘制到canvas上，并指定图片的坐标和尺寸。
可以使用canvas的其他方法对图片进行处理，如旋转、缩放、裁剪等。

以下是一个简单的h5 canvas贴图的示例代码：

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>Canvas贴图示例</title>
</head>
<body>
	<canvas id="myCanvas" width="400" height="400"></canvas>
	<script>
		var canvas = document.getElementById("myCanvas");
		var ctx = canvas.getContext("2d");

		// 创建一个Image对象
		var img = new Image();
		img.src = "image.jpg";

		// 在Image对象的onload事件中，获取图片的宽度和高度，并将图片绘制到canvas中
		img.onload = function() {
			var imgWidth = img.width;
			var imgHeight = img.height;
			ctx.drawImage(img, 0, 0, imgWidth, imgHeight); // 将图片绘制到canvas上
		};
	</script>
</body>
</html>

在上面的示例代码中，我们创建了一个canvas，并在canvas上绘制了一张图片。我们可以通过修改drawImage方法的参数来改变图片的位置、尺寸等属性。