《HTML5 canvas开发详解(第2版)》——导读

简介: 自从本书第1版发行之后,在过去的两年里,HTML5 Canvas的使用有了突飞猛进的增长。本书的第1版可以称得上是第一批介绍Canvas的专著之一。在我们为自己的快速而感到自豪同时也意味着我们曾经独自进行了大量的研究和探索。




前言
第2版介绍
自从本书第1版发行之后,在过去的两年里,HTML5 Canvas的使用有了突飞猛进的增长。本书的第1版可以称得上是第一批介绍Canvas的专著之一。在我们为自己的快速而感到自豪同时也意味着我们曾经独自进行了大量的研究和探索。早在2011年,只有极少数HTML5 Canvas应用的例子和教程。但在2013年情形发生了改变。现在有许多关于HTML5 Canvas的资源可供选择,从框架到API,有许多网站和书籍进行专门的阐述。为了编写第2版,我们进行了大量艰辛的工作来检查在第1版中哪些部分有效,哪些部分已经失效。在接下来的章节中,描述了一些令人激动的改变和更新,这几页是非正常值得期待的。

第1版的更新
本书大部分内容与第1版保持一致。这样做的原因是因为本书是面向广泛开发者的,既有从来没有接触过Canvas的开发者,也有已经有一些经验想学习Canvas高级使用技巧的开发者。

本书每一章都重新进行了修订,对代码进行更新和优化,更新浏览器的兼容性以及在过去两年中发现的其他问题。一小部分内容被删除了。一些冗余的代码列表从书中移动到了代码包中,方便了本书的阅读。我们用更多更简短的示例替换了第4章的部分内容。我们还完全重写了第10章。我们删除了PhoneGap的介绍,这是因为类似的内容已经非常普遍了。
前言
[第1章 HTML5 Canvas简介
1.1 什么是HTML5]
1.2 基础的HTML5页面
1.3 本书使用的基础HTML页面
1.4 文档对象模型(DOM)和Canvas
1.5 JavaScript和Canvas
1.6 HTML5 Canvas版“Hello World!”
1.7 用console.log调试
1.8 2D环境及其当前状态
1.9 HTML5 Canvas对象
1.10 第二个示例:猜字母
1.11 动画版本的Hello World
1.12 内容预告
[第2章 在Canvas上绘图
2.1 本章基本文件设置
2.2 基本矩形
2.3 Canvas状态
2.4 使用路径创建线段
2.5 高级路径方法
2.6 在画布上合成
2.7 简单画布变换
2.8 用颜色和渐变填充对象
2.9 用图案填充形状
2.10 创建阴影
2.11 清除画布的方法
2.12 检查一个点是否在当前路径
2.13 绘制一个焦点环
2.14 内容预告
第3章 HTML5 Canvas的文本API
第4章 Canvas图像
第5章 数学、物理与动画
第6章 在画布中融合HTML5视频
第7章 使用音频
第8章 Canvas游戏(上)
第9章 Canvas游戏(下)
第10章 在移动设备上开发
第11章 进一步探索
附录 完整代码列表

目录
打赏
0
0
0
0
1819
分享
相关文章
基于HTML5+Canvas绘制的鼠标跟随三角形碎片光标动画代码
基于HTML5+Canvas绘制的鼠标跟随三角形碎片光标动画特效代码,很有意思,一团三角形碎片跟随鼠标的移动,不冗长、不笨重,反而有一种很轻盈的感觉,非常不错
75 29
Html5 Canvas绘制圆形仪表盘动画源码
Html5 Canvas绘制圆形仪表盘动画特效是一款基于HTML5 Canvas绘制的圆形百分比仪表盘动画特效。
34 1
html5 canvas五彩碎纸屑飘落动画特效
h5 canvas飘落纸片动画是一款实现五彩纸屑飘落的背景动画特效,基于canvas绘制的空中飘落的纸屑片动画特效,适用于网页动态背景效果代码。简单使用,欢迎下载!代码适用浏览器:搜狗、360、FireFox(建议)、Chrome、Safari、Opera、傲游、世界之窗,是一款不错的的特效插件,希望大家喜欢!
79 5
基于 HTML5 和 Canvas 开发的在线图片编辑器
基于 HTML5 和 Canvas 开发的在线图片编辑器
176 0
基于canvas实现的彩色纸屑组成文字3d动画HTML源码
基于canvas实现的彩色纸屑组成文字3d动画HTML源码
59 0
基于canvas实现的彩色纸屑组成文字3d动画HTML源码
HTML5 Canvas制作的粒子十秒倒计时源码
一段基于HTML5 Canvas制作的粒子爆炸,十秒数字倒计时,全屏倒计时动画效果,给人一种非常大气的视觉感
74 0
HTML5 Canvas制作的粒子十秒倒计时源码
Canvas三维变化背景动画HTML源码
Canvas三维变化背景动画HTML源码
58 5
HTML5 SVG和canvas的性能探讨
HTML5 中的 SVG(可缩放矢量图形)和 Canvas(画布)分别用于网页图形绘制。SVG 基于矢量图形,使用 XML 描述,适合静态或少量动态内容(如图标、图表),易于编辑且保持高分辨率;Canvas 则基于位图,通过 JavaScript 绘制,更适合快速更新大量图形的场景(如游戏、动态动画),但在复杂图形计算时可能遇到性能瓶颈。总体而言,SVG 适用于静态和少量动态内容,而 Canvas 更适合高频率更新和性能要求高的场景。
HTML5 Canvas详解及应用
HTML5 Canvas 允许通过 JavaScript 在网页上动态绘制图形、动画等视觉内容。首先在 HTML 中定义 `<canvas>` 元素,并通过 JavaScript 获取画布上下文进行绘制。常见方法包括绘制矩形、路径、圆形和文本,以及处理图像和创建动画效果。适用于游戏开发、数据可视化、图像编辑和动态图形展示等多种应用场景。需要注意性能优化、无状态绘制及自行处理事件等问题。
用HTML5中的 画布(Canvas)在“圳品”信息系统网页上绘制显示饼图
用HTML5中的 画布(Canvas)在“圳品”信息系统网页上绘制显示饼图