HTML5使用drawImage()方法绘制图像
摘要:一、绘制图像使用drawImage()方法绘制图像。绘图环境提供了该方法的三个不同版本。drawImage(image,x,y):在canv...
一、绘制图像
使用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) : 从图片中切割出一个矩形区域(sourceX,sourceY,sourceWidth,sourceHeight),缩放到指定的宽度和高度,并在canvas中(x,y)绘制出来。
二、<img>标签
绘制图片前,还需要将图片加载到浏览器中。这里我们仅仅在canvas标签后面添加一个<img>标签。
<img src = "tk.jpg" id = "tkjpg">
三、绘制图片
上一篇:
HTML5 创建canvas元素示例代码
下一篇:
HTML5游戏前端开发秘籍
相关阅读
网友关注
网友最新关注视频
- 第五单元 民族艺术的瑰宝_16. 形形色色的民族乐器_第一课时(岭南版六年级上册)_T1406126
- 沪教版牛津小学英语(深圳用) 四年级下册 Unit 4
- 外研版英语七年级下册module3 unit2第一课时
- 苏科版数学 八年级下册 第八章第二节 可能性的大小
- 第12章 圆锥曲线_12.7 抛物线的标准方程_第一课时(特等奖)(沪教版高二下册)_T274713
- 河南省名校课堂七年级下册英语第一课(2020年2月10日)
- 《小学数学二年级下册》第二单元测试题讲解
- 小学英语单词
- 【部编】人教版语文七年级下册《逢入京使》优质课教学视频+PPT课件+教案,安徽省
- 三年级英语单词记忆下册(沪教版)第一二单元复习
精品推荐
分类导航
网页设计子分类
最新HTML5教程学习