html5 canvas 图片

图片

 

Context对象中拥有drawImage()方法可以将外部图片绘制到Canvas中。drawImage()方法的3种原型如下：

 

drawImage(image, dx, dy);

 

drawImage(image, dx, dy,dw, dh);

 

drawImage(image, sx, sy,sw, sh, dx, dy, dw, dh);

 

        //sx:可选。开始剪切的 x 坐标位置。
        //sy:     可选。开始剪切的 y 坐标位置。
        //sw:     可选。被剪切图像的宽度。
        //sh:可选。被剪切图像的高度。

        //dx:     在画布上放置图像的 x 坐标位置。
        //dy:在画布上放置图像的 y 坐标位置。
        //dw:可选。要使用的图像的宽度。（伸展或缩小图像）
        //dh:可选。要使用的图像的高度。（伸展或缩小图像）