HTML5 Canvas核心技术:图形、动画与游戏开发 内容简介:

《HTML5 Canvas核心技术:图形、动画与游戏开发》中,畅销书作家David Geary(基瑞)先生以实用的范例程序直接切入这套API,全面讲解其功能,以求让读者实现出内容丰富且界面一致的网络应用程序,并将开发好的程序部署在多种设备及操作系统之上。

教程地址:HTML5 Canvas核心技术:图形、动画与游戏开发 PDF扫描版

HTML5 Canvas核心技术:图形、动画与游戏开发

目录:

前言

第1章 基础知识

1.1 canvas元素

1.1.1 canvas元素的大小与绘图表面的大小

1.1.2 canvas元素的api

1.2 canvas的绘图环境

1.2.12d绘图环境

1.2.2 canvas状态的保存与恢复

1.3 本书程序清单的规范格式

1.4 开始学习html5

1.4.1 规范

1.4.2 浏览器

1.4.3 控制台与调试器

1.4.4 性能

1.5 基本的绘制操作

1.6 事件处理

1.6.1 鼠标事件

1.6.2 键盘事件

1.6.3 触摸事件

1.7 绘制表面的保存与恢复

1.8 在canvas中使用html元素

1.9 打印canvas的内容

1.10 离屏canvas

1.11 基础数学知识简介

1.11.1 求解代数方程

1.11.2 三角函数

1.11.3 向量运算

1.11.4 根据计量单位来推导等式

1.12 总结

第2章 绘制

2.1 坐标系统

2.2 canvas的绘制模型

2.3 矩形的绘制

2.4 颜色与透明度

2.5 渐变色与图案

2.5.1 渐变色

2.5.2 图案

2.6 阴影

2.7 路径、描边与填充

2.7.1 路径与子路径

2.7.2 剪纸效果

2.8 线段

2.8.1 线段与像素边界

2.8.2 网格的绘制

2.8.3 坐标轴的绘制

2.8.4 橡皮筋式的线条绘制

2.8.5 虚线的绘制

2.8.6 通过扩展canvasrenderingcontext2d来绘制虚线

2.8.7 线段端点与连接点的绘制

2.9 圆弧与圆形的绘制

2.9.1 arc()方法的用法

2.9.2 以橡皮筋式辅助线来协助用户画圆

2.9.3 arcto()方法的用法

2.9.4 刻度仪表盘的绘制

2.10 贝塞尔曲线

2.10.1 二次方贝塞尔曲线

2.10.2 三次方贝塞尔曲线

2.11 多边形的绘制

2.12 高级路径操作

2.12.1 拖动多边形对象

2.12.2 编辑贝塞尔曲线

2.12.3 自动滚动网页,使某段路径所对应的元素显示在视窗中

2.13 坐标变换

2.13.1 坐标系的平移、缩放与旋转

2.13.2 自定义的坐标变换

2.14 图像合成

2.15 剪辑区域

2.15.1 通过剪辑区域来擦除图像

2.15.2 利用剪辑区域来制作伸缩式动画

2.16 总结

第3章 文本

3.1 文本的描边与填充

3.2 设置字型属性

3.3 文本的定位

3.3.1 水平与垂直定位

3.3.2 将文本居中

3.3.3 文本的度量

3.3.4 绘制坐标轴旁边的文本标签

3.3.5 绘制数值仪表盘周围的文本标签

3.3.6 在圆弧周围绘制文本

3.4 实现文本编辑控件

3.4.1 指示文本输入位置的光标

3.4.2 在canvas中编辑文本

3.4.3 文本段的编辑

3.5 总结

第4章 图像与视频

4.1 图像的绘制

4.1.1 在canvas之中绘制图像

4.1.2 drawimage()方法的用法

4.2 图像的缩放

4.3 将一个canvas绘制到另一个canvas之中

4.4 离屏canvas

4.5 操作图像的像素

4.5.1 获取图像数据

4.5.2 修改图像数据

4.6 结合剪辑区域来绘制图像

4.7 以图像制作动画

4.8 图像绘制的安全问题

4.9 性能

4.9.1 对比drawimage(htmlimage)、drawimage(htmlcanvas)与putimagedata()的绘图效率

4.9.2 在canvas中绘制另一个canvas与绘制普通图像之间的对比;在绘制时缩放图像与保持原样之间的对比

4.9.3 遍历图像数据

4.10 放大镜

4.10.1 使用离屏canvas

4.10.2 接受用户从文件系统中拖放进来的图像

4.11 视频处理

4.11.1 视频格式

4.11.2 在canvas中播放视频

4.11.3 视频处理

4.12 总结

第5章 动画

5.1 动画循环

5.1.1 通过requestanimationframe()方法让浏览器来自行决定帧速率

5.1.2 internet explorer浏览器对requestanimationframe()功能的实现

5.1.3 可移植于各浏览器平台的动画循环逻辑

5.2 帧速率的计算

5.3 以不同的帧速率来执行各种任务

5.4 恢复动画背景

5.4.1 利用剪辑区域来处理动画背景

5.4.2 利用图块复制技术来处理动画背景

5.5 利用双缓冲技术绘制动画

5.6 基于时间的运动

5.7 背景的滚动

5.8 视差动画

5.9 用户手势

5.10 定时动画

5.10.1 秒表

5.10.2 动画计时器

5.11 动画制作的最佳指导原则

5.12 总结

第6章 精灵

6.1 精灵概述

6.2 精灵绘制器

6.2.1 描边与填充绘制器

6.2.2 图像绘制器

6.2.3 精灵表绘制器

6.3 精灵对象的行为

6.3.1 将多个行为组合起来

6.3.2 限时触发的行为

6.4 精灵动画制作器

6.5 基于精灵的动画循环

6.6 总结

……

第7章 物理效果

第8章 碰撞检测

第9章 游戏开发

第10章 自定义控件

第11章 移动平台开发

HTML5 Canvas核心技术:图形、动画与游戏开发 PDF扫描版​的更多相关文章

  1. HTML5 Canvas核心技术图形动画与游戏开发 ((美)David Geary) 中文PDF扫描版​

    <html5 canvas核心技术:图形.动画与游戏开发>是html5 canvas领域的标杆之作,也是迄今为止该领域内容最为全面和深入的著作之一,是公认的权威经典.amazon五星级超级 ...

  2. HTML5 Canvas核心技术图形动画与游戏开发(读书笔记)----第一章,基础知识

    一,canvas元素 1 为了防止浏览器不支持canvas元素,我们设置“后备内容”(fallback content),下面紫色的字即为后备内容 <canvas id="canvas ...

  3. HTML5游戏开发 PDF扫描版​

    很多从事Web前端开发的人对HTML总有些不满,比如需要手动检查和设计很多格式代码,不仅容易出错,而且存在大量重复.好在HTML5让我们看到了曙光.作为下一代Web开发标准,HTML5成为主流的日子已 ...

  4. Html5 Canvas核心技术(图形,动画,游戏开发)--基础知识

    基础知识 canvas 元素可以说是HTML5元素中最强大的一个,他真正的能力是通过canvas的context对象表现出来的.该环境对象可以从canvas元素身上获得. <body> & ...

  5. HTML5和CSS3实例教程 中文版 高清PDF扫描版

    HTML5和CSS3实例教程共分3部分,集中讨论了HTML5和CSS3规范及其技术的使用方法.首先是规范概述,介绍了新的结构化标签.表单域及其功能(包括自动聚焦功能和占位文本)和CSS3的新选择器.接 ...

  6. HTML5 & CSS3编程入门经典 ((美)Rob Larsen) pdf扫描版

    HTML和CSS是构建网页所需要了解的两种核心编程语言,拉尔森编著的这本<HTML5&CSS3编程入门经典>详细介绍了这两种语言. <HTML5&CSS3编程入门经典 ...

  7. HTML5从入门到精通(明日科技) 中文pdf扫描版

    HTML5从入门到精通(明日科技) 中文pdf扫描版

  8. HTML5 Canvas核心技术—图形、动画与游戏开发.pdf2

    事件处理: HTML5应用程序是以事件来驱动的,可以在canvas中增加一个事件监听器,当事件发生时,浏览器就会调用这个监听器 //方法一canvas.onmousedown=function(e){ ...

  9. HTML5 Canvas核心技术—图形、动画与游戏开发.pdf8

    第6章 精灵 精灵(sprite),它是一种可以集成入动画之中的图像对象,赋予它们各种行为,精灵并非Canvas API的一部分,,但都是从它衍生而来 本章将会实现三种设计模式:策略模式(精灵与绘制器 ...

随机推荐

  1. Java基础数据类型二进制转换

    前言: 本文主要介绍java基础类型的二进制转换和二进制的基本概念. 二进制: 1,二进制是以0和1为码,逢2进1,比如3=11=1*2+1. 2,在计算机当中其它进制的算法基本基于2进制,因为计算机 ...

  2. 利用全局变量$_SESSION和register_shutdown_function自定义会话处理

    register_shutdown_function 可以注册一个自定义的函数,在程序运行结束之前 执行. 在做ecshop的二次开发过程中,虽然代码 太老太乱太冗余,但ec的会话处理的设计感觉还是不 ...

  3. java代码对按钮进行监听---------------打印出每次点击按钮的次数

    其实,我真不会写嗯? package com.a.b; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; ...

  4. 实验吧CTF题库-隐写术(部分)

    Spamcarver 用kali下载图片 root@sch01ar:~# wget http://ctf5.shiyanbar.com/stega/spamcarver/spamcarver.jpg ...

  5. XML注释与Description标签及Java:注解(Annotation)的关系

    NET中的规范标准注释(一) -- XML注释标签讲解 一.摘要 .Net允许开发人员在源代码中插入XML注释,这在多人协作开发的时候显得特别有用. C#解析器可以把代码文件中的这些XML标记提取出来 ...

  6. Python时间日期函数讲解

    所有日期.时间的api都在datetime模块内. 1. 日期输出格式化 datetime => string import datetime now = datetime.datetime.n ...

  7. O2耳放 DIY 模拟放大

    http://nwavguy.blogspot.com/2011/07/o2-headphone-amp.html 原文链接 O2耳放. O2是一个DIY项目.免费,开源.本篇博客也免费,开源. O2 ...

  8. Python基础学习四 列表、元组、字典、集合

    列表list,用中括号“[ ]”表示 1.任意对象的有序集合 列表是一组任意类型的值,按照一定顺序组合而成的 2.通过偏移读取 组成列表的值叫做元素(Elements).每一个元素被标识一个索引,第一 ...

  9. easylogging++学习记录(一):接入

    easylogging++是一个非常轻量级并且非常高效的一个日志库,支持文件配置,支持线程安全,并且其自定义格式非常的方便,最关键的是,其所有代码都集中在一个.h头文件之中,完全不需要引用第三方库,接 ...

  10. sql2012增加Sequence对象

    官方给出了一大堆SQL2012相对于SQL2008R2的新特性,但是大多数对于普通开发人员来说都是浮云,根本用不到,下面就说说一些对于开发人员来说比较有用的新特性. Sequence对象对于Oracl ...