Chinaunix首页 | 论坛 | 博客
  • 博客访问: 397156
  • 博文数量: 466
  • 博客积分: 0
  • 博客等级: 民兵
  • 技术积分: 10
  • 用 户 组: 普通用户
  • 注册时间: 2015-03-16 13:59
文章分类

全部博文(466)

文章存档

2015年(466)

我的朋友

分类: 系统运维

2015-03-16 14:16:32

drawImage 方法允许在 canvas 中插入其他图像
( img 和 canvas 元素) 。在 Opera 中可以再 canvas 中绘制 SVG 图形。此方法比较复杂,可以有3个、5个或9个参数

3个参数:最基本的 drawImage使用方法。一个参数指定图像位置,另两个参数设置图像在 canvas中的位置。
5个参数:中级的 drawImage 使用方法,包括上面所述3个参数,加两个参数指明插入图像宽度和高度 (如果你想改变图像大小)。
9个参数:最复杂 drawImage 杂使用方法,包含上述5个参数外,另外4个参数设置源图像中的位置和高度宽度。这些参数允许你在显示图像前动态裁剪源图像。

下面是上述三个使用方法的例子:

  • // Three arguments: the element, destination (x,y) coordinates.   
  • context.drawImage(img_elem, dx, dy);   
  • // Five arguments: the element, destination (x,y) coordinates, and destination     
  • // width and height (if you want to resize the source image).   
  • context.drawImage(img_elem, dx, dy, dw, dh);   
  • // Nine arguments: the element, source (x,y) coordinates, source width and     
  • // height (for cropping), destination (x,y) coordinates, and destination width     
  • // and height (resize).   
  • context.drawImage(img_elem, sx, sy, sw, sh, dx, dy, dw, dh);
阅读(818) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~