Desenhe figuras
Var Image = new Image ();
image.src = "http://img4.duitang.com/uploads/item/201406/25/20140625182321_4mtau.thumb.700_0.jpeg";
image.onload = function () {}
Context.Drawimage (imagem, x, y);
Context.drawimage (imagem, x, y, w, h);
Context.Drawiamge (imagem, SX, SY, SW, SH, DX, DY, DW, DH);
Picture Tiling
Var pat = context.createpattern (imagem, "repetir");
Context.fillstyle = Pat;
Context.fillRect (0,0,400.300);
Corte de imagem
Desenhe o caminho primeiro
Context.clip ();
<html> <head> <meta charset = "utf-8"> <title> desenhe fotos </itit> <meta name = "viewport" content = "width = width de dispositivo, escala inicial = 1, escala mínima = 1, lata-scala type = "text/javascript"> var ocanvas = document.getElementById ("tela"); var context = ocanvas.getContext ("2D"); context.fillstyle = "#ededed"; context.fillRect (0, 0, 500, 500); // desenhe a imagem var iMg = new Image (); // crie img.src = "img/01.jpg"; // Endereço da imagem img.onload = function () {// detecta todas as informações da imagem Página de carregamento context.drawimage (img, 0, 0); // objeto img; 0,0: IMG coordenar o ponto de partida}; </script> </body> </html>