canvas实现平铺

代码：

/**
 * Created by Administrator on 2016/1/30.
 */
function draw(id){
    var canvas = document.getElementById(id);
    var context = canvas.getContext('2d');
    var img = new Image();
    img.src = "图像/1234.gif";
    img.onload = function (){
        var ptrn = context.createPattern(img,'no-repeat');
        context.fillStyle = ptrn;
        context.fillRect(0,0,300,200);
    }
}

用到的方法为createPattern()方法。

　　格式：

　　　　　createPattern（image,repetitionStyle）:

　　　　　　　　 image:图像。

　　　　　　　　repetitionStyle:平铺方式。有4个值,

　　　　　　　　　　　　　　　　repeat：在各个方向上平铺,

　　　　　　　　　　　　　　　　no-repeat：只使用一次,

　　　　　　　　　　　　　　　　repeat-x：在x轴上平铺,

　　　　　　　　　　　　　　　　repeat-y：在y轴上平铺。