Canvas 第八章 图像处理

第八章 图像处理

绘制图像

var elem=document.getElementById("canvas");
			var canvas=elem.getContext("2d");
			
			img=new Image();
			img.src="img/test.jpg";
			img.onload=function(n){
				for(var i=0;i<3;i++){
					canvas.drawImage(img,i*50,i*50,50,50);
				}
			}

图像平铺

<canvas height="500" width="500" id="canvas"></canvas>
		<script>
			var elem=document.getElementById("canvas");
			var canvas=elem.getContext("2d");
			
			img=new Image();
			img.src="img/test.jpg";
			window.onload=function(){
				var parn=canvas.createPattern(img,"repeat-y");
				canvas.fillStyle=parn;
				canvas.fillRect(0,0,500,500);
			}

切割元素