本节书摘来自异步社区《HTML5 canvas开发详解(第2版)》一书中的第1章,第1.9节,作者: 【美】Steve Fulton , Jeff Fulton 更多章节内容可以访问云栖社区“异步社区”公众号查看。

1.9 HTML5 Canvas对象

Canvas对象是通过在HTML页面的< body >部分中放置< canvas >标签创建的,也可以通过以下代码创建画布实例。

var theCanvas = document.createElement("canvas");

Canvas对象有两个相关的属性和方法可以通过JavaScript访问:width和height。这些属性显示当前HTML页面创建的画布的宽度和高度。这里需要强调的是,这两个属性并不是只读的。例如,通过代码可以对它们进行更新,从而影响HTML页面上的对象。这意味着什么?这意味着用户可以在HTML页面上动态地调整画布尺寸而无须重新加载。

提示
也可以使用CSS样式来改变画布的缩放比例。与调整大小不同,缩放提取当前画布的位图区域,然后重新取样以适应CCS样式中设定的宽度和高度的值。例如,将画布缩放到400 × 400区域,可以使用以下CSS样式。

style="width: 400px; height:400px"

第3章有一个使用变换矩阵缩放Canvas的示例。
Canvas对象目前有两个公共方法。第一个是getContext(),本章前面就使用过。本书将继续使用这个方法获得Canvas 2D环境对象的引用,这样才能在画布上进行绘图。第二个方法是toDataURL(),这个方法返回的数据是代表当前Canvas对象产生位图的字符串。它就像是屏幕的一个快照,通过提供一个不同的MIME类型作为参数,可以返回不同的数据格式。基本的格式是image/png,但是也可以获取image/jpeg和其他格式。下一个应用程序将会使用toDataURL()方法,把画布中的图像导出到另一个浏览器窗口。

提示
第三个公共的方法——toBlob(),已经被定义,并且正在不同的浏览器上实现该方法。toBlob([callback])将返回一个引用图像的文件,而不是一个base64编码的字符串。目前,尚未有任何浏览器实现该方法。

《HTML5 canvas开发详解(第2版)》——1.9 HTML5 Canvas对象相关推荐

  1. 《HTML5 canvas开发详解(第2版)》——1.3 本书使用的基础HTML页面

    本节书摘来自异步社区<HTML5 canvas开发详解(第2版)>一书中的第1章,第1.3节,作者: [美]Steve Fulton , Jeff Fulton 更多章节内容可以访问云栖社 ...

  2. 《HTML5 Canvas开发详解》——1.7 2D上下文及其当前状态

    本节书摘来自异步社区<HTML5 Canvas开发详解>一书中的第1章,第1.7节,作者: [美]Steve Fulton , Jeff Fulton 更多章节内容可以访问云栖社区&quo ...

  3. 《Web前端开发精品课——HTML5 Canvas开发详解》——第一部分第二章节

    本节书摘来自异步社区<Web前端开发精品课--HTML5 Canvas开发详解>一书中的第1部分,第2章,作者:莫振杰 著,更多章节内容可以访问云栖社区"异步社区"公众 ...

  4. 《Linux设备驱动开发详解(第2版)》隆重出版

    Linux设备驱动开发详解(第2版)(前一版狂销3万册,畅销书最新升级) [新品] 点击看大图     基本信息 * 作者: 宋宝华       * 出版社:人民邮电出版社     * ISBN:97 ...

  5. linux设备驱动总结,《Linux设备驱动开发详解(第3版)》海量更新总结

    本博实时更新<Linux设备驱动开发详解(第3版)>的最新进展. 2015.2.26 几乎完成初稿. [F]是修正或升级:[N]是新增知识点:[D]是删除的内容 第1章 <Linux ...

  6. linux设备驱动开发详解 第三版,《Linux设备驱动开发详解(第3版)》进展同步更新...

    2014.8.25 目前初步完成2-11章以及第22章 <Linux设备驱动的调试>,相对于第2版,这几章主要的变更. 本博实时更新<Linux设备驱动开发详解(第3版)>的最 ...

  7. 《Linux设备驱动开发详解(第3版)》(即《Linux设备驱动开发详解:基于最新的Linux 4.0内核》)进展同步更新

    本博实时更新<Linux设备驱动开发详解(第3版)>的最新进展. 目前已经完成稿件. 2015年8月9日,china-pub开始上线预售: http://product.china-pub ...

  8. Linux设备驱动开发详解 第3版 (即 Linux设备驱动开发详解 基于最新的Linux 4 0内核 )前言

    Linux从未停歇脚步.Linus Torvalds,世界上最伟大的程序员之一,Linux内核的创始人,Git的缔造者,仍然在没日没夜的合并补丁,升级内核.做技术,从来没有终南捷径,拼的就是坐冷板凳的 ...

  9. 《Linux设备驱动开发详解(第3版)》(即《Linux设备驱动开发详解:基于最新的Linux 4.0内核》)网购链接

    <Linux设备驱动开发详解:基于最新的Linux 4.0内核> china-pub   天猫     dangdang   京东 China-pub 8月新书销售榜 推荐序一 技术日新月 ...

最新文章

  1. Android Studio 多渠道打包
  2. mac os 升级为Mountain Lion后,eclipse找不到JRE的问题
  3. 【学习】SpringBoot之自定义拦截器
  4. C# 值类型与引用类型的详解
  5. java源程序编译型_Java语言的源程序不是编译型的,而是编译解释型的。
  6. python继承方式是基于原型吗_[译] 为什么原型继承很重要
  7. win32开发(添加菜单)
  8. k8s中yaml文件pod的语法(转)
  9. spring教程(上)
  10. hibernate 批量插入 Batch
  11. 第六章 实验报告 (函数与宏定义)
  12. Cesium + Vue 点击获取经纬度 气泡窗(三)
  13. 【PM模块】基础概念简介
  14. 浅淡风月 一些有意思的文章
  15. 什么是搜索引擎关键词?搜索引擎关键词优化
  16. 为什么四大文明古国到现在只剩中国了
  17. 讨厌google.cn怎么办?
  18. [无线玩家]玩转无线路由之DD-WRT基础扫盲
  19. Proteus STM32仿真学习板
  20. matlab中函数参数和变量作用域

热门文章

  1. 恐怖的shell命令
  2. jquery获取元素的值,获取当前对象的父对象等等
  3. 民族、学历学位、所学专业、、专业技术职务 对应表
  4. Zarafa 7.0.11/7.1.2 发布
  5. Qt学习笔记,Qt程序架构设计要旨
  6. cisco路由器基本实验之七 Standard Access-Lists with RIP (Boson NetSim)
  7. 【原创 HadoopSpark 动手实践 1】Hadoop2.7.3 安装部署实践
  8. 自签名证书说明——自签名证书的Issuer和Subject是一样的。不安全的原因是:没有得到专业SSL证书颁发的机构的技术支持?比如使用不安全的1024位非对称密钥对,有效期设置很长等...
  9. element-ui中el-tree树形控件-树节点的选择(选中当前节点,获取当前id并且获取其父级id)...
  10. 2018.1.15 6周1次课