关于Canvas 平铺

关于Canvas 平铺
1.算法平铺
var scale = 5;
     //缩小后的图像宽度
     var w1 = image.width/scale;
     //缩小后的图像高度
     var h1 = image.height/scale;
     //平铺横向个数
     var hNums = canvas.width/w1;
     //平铺纵向个数
     var vNums = canvas.height/h1;
     
     for(var i=0;i<hNums;i++){
      for(var j = 0;j<vNums;j++){
       ctx.drawImage(image,i*w1,j*h1,w1,h1);
      }
     }
2.createPattern 平铺
var myPattern = ctx.createPattern(img,'repeat');//type: no-repeat,repeat-x,repeat-y,repeat
     ctx.fillStyle = myPattern;
     ctx.fillRect(0,0,400,300);

你可能感兴趣的:(关于Canvas 平铺)