不得不说，html5中的canvas真的非常强大，从图片处理，到视频处理，再到游戏开发，都能见到canvas的身影，然而，就这一个标签，功能居然如此强大，这主要归功于canvas强大的API，也正是因为这么多的API，让很多人对canvas望而却步。

一、绘制图像 使用drawImage()方法绘制图像。绘图环境提供了该方法的三个不同版本。 drawImage(image,x,y) ： 在canvas中(x,y)处绘制图片。 drawImage(image,x,y,width,height) ： 在canvas中(x,y)处绘制图片，并将其缩放到指定的宽度和高度。 drawImage(image,sourceX,sourceY,sourceWidth,sourceHeight,x,y,width,height) ： 从图片中切割出一个矩形区

Canvas，中文译为“画布”，HTML5中新增了元素，可以结合Javascr ipt动态地在画布中绘制图形。 今天，我们不讲Canvas的图形绘制，而是讲如何对图片进行处理。 大概流程非常简单，主要分为以下三个步骤： 是的，就像把大象装进冰箱一样简单，哈哈。 一、主要API 整个流程中所用到的主要Canvas API有： 绘制图像： drawImage() 获取图像数据： getImageData() 重写图像数据： putImageData() 导出图像：