HTML5与WebGL编程

HTML5与WebGL编程
分享
扫描下方二维码分享到微信
打开微信,点击右上角”+“,
使用”扫一扫“即可将网页分享到朋友圈。
作者: [美] (Tony Parisi) ,
2016-06
版次: 01
ISBN: 9787115421333
定价: 79.00
装帧: 平装
开本: 16开
纸张: 胶版纸
页数: 311页
字数: 487千字
正文语种: 简体中文
70人买过
  • 本书全面讲解了使用HTML5和WebGL开发3D应用的Web技术,理论与实践相结合,涵盖桌面和移动两端。全书分两部分:基础知识和应用开发。在详细介绍开发相关理论、工具、框架和库的基础上,作者通过3D产品浏览器、游戏和交互培训系统等案例,生动讲解了3D应用开发的全过程。
    本书适合中高级Web及页游开发人员阅读。 Tony Parisi

    Web 3D标准的先驱、企业家、CTO、架构师。VRML和X3D语言的联合作者,这两者已经成为Web 3D图形的ISO标准。另著有《WebGL入门指南》。

    潘征

    网名此方,目前就职于百度FEX前端研发团队,专注前端复杂应用研发。 目录

    前言  xi
    第一部分 基础知识
    第1章 绪论 2
    1.1 HTML5:新型的视觉媒介 4
    1.1.1 浏览器平台 4
    1.1.2 浏览器支持情况 6
    1.2 3D图形的基础知识 6
    1.2.1 什么是3D 6
    1.2.2 3D坐标系 7
    1.2.3 网格、多边形与顶点 8
    1.2.4 材质、纹理与光源 9
    1.2.5 变换与矩阵 9
    1.2.6 相机、透视、视口与投影 10
    1.2.7 着色器 11
    第2章 WebGL:实时3D渲染 13
    2.1 WebGL基础 14
    2.2 WebGL API 15
    2.3 WebGL应用剖析 16
    2.4 一个简单的WebGL示例 16
    2.4.1 Canvas 元素和WebGL 绘图上下文 17
    2.4.2 视口 18
    2.4.3 缓冲、缓冲数组和类型化数组 18
    2.4.4 矩阵 19
    2.4.5 着色器 20
    2.4.6 绘制图元 22
    2.5 创建3D几何体 23
    2.6 添加动画 27
    2.7 使用纹理映射 28
    2.8 小结 34
    第3 章 Three.js——一款JavaScript 3D引擎 35
    3.1 使用Three.js创建的代表性项目 35
    3.2 Three.js概览 38
    3.2.1 初始化Three.js 40
    3.2.2 Three.js工程结构 40
    3.3 一个简单的Three.js程序 41
    3.3.1 创建渲染器 43
    3.3.2 创建场景 43
    3.3.3 运行循环的实现 45
    3.3.4 为场景添加光照 46
    3.4 小结 48
    第4章 Three.js中的图形和渲染 49
    4.1 几何图形和网格 49
    4.1.1 预置的几何形状类型 49
    4.1.2 路径、形状和挤出 50
    4.1.3 几何形状基础类 52
    4.1.4 用于优化网格渲染的BufferGeometry 55
    4.1.5 从建模软件包中导入网格数据 56
    4.2 场景图和空间变换的层级结构 57
    4.2.1 利用场景图来管理复杂场景 57
    4.2.2 Three.js 中的场景图 57
    4.2.3 平移、旋转和缩放的表示 61
    4.3 材质 61
    4.3.1 标准网格材质 61
    4.3.2 使用多重纹理增添逼真效果 63
    4.4 光源 67
    4.5 阴影 69
    4.6 着色器 73
    4.6.1 ShaderMaterial类:编写你自己的着色器代码 74
    4.6.2 在Three.js 中使用GLSL着色器代码 75
    4.7 渲染 78
    4.7.1 后处理和多道渲染 79
    4.7.2 延迟渲染 80
    4.8 小结 80
    第5章 3D动画 81
    5.1 使用requestAnimationFrame()来驱动动画 82
    5.1.1 在你的应用中使用requestAnimationFrame() 83
    5.1.2 requestAnimationFrame()和性能 84
    5.1.3 基于帧的动画和基于时间的动画 85
    5.2 使用程序更新属性的方式来构建动画 85
    5.3 使用补间来进行动画过渡 87
    5.3.1 插值 87
    5.3.2 Tween.js库 88
    5.3.3 缓动 90
    5.4 使用关键帧来实现复杂动画 91
    5.4.1 Keyframe.js——一个简单的帧动画通用库 92
    5.4.2 使用关键帧创建关节动画 94
    5.5 使用曲线和路径创建平滑自然的运动 96
    5.6 使用变形目标来创建人物和面部动画 99
    5.7 使用蒙皮来构建角色动画 100
    5.8 使用着色器来进行动画 104
    5.9 小结 109
    第6章 CSS3:高级页面效果 110
    6.1 CSS变换 112
    6.1.1 使用3D变换 113
    6.1.2 添加透视 115
    6.1.3 创建变换层级 117
    6.1.4 控制背面渲染 119
    6.1.5 CSS变换属性汇总 122
    6.2 CSS过渡 122
    6.3 CSS动画 127
    6.4 挑战CSS的极限 130
    6.4.1 渲染3D物体 130
    6.4.2 渲染3D环境 132
    6.4.3 使用CSS自定义滤镜来实现高级着色器效果 134
    6.4.4 用Three.js来渲染CSS 3D 135
    6.5 小结 135
    第7章 Canvas:通用2D绘图 137
    7.1 Canvas基础 137
    7.1.1 Canvas元素和2D绘图上下文 138
    7.1.2 Canvas API的功能 139
    7.2 使用Canvas API来渲染3D 144
    7.3 基于Canvas渲染的3D库 147
    7.3.1 K3D 147
    7.3.2 Three.js的Canvas渲染 148
    7.4 小结 153
    第二部分 应用开发技术
    第8 章 3D内容制作流程 156
    8.1 3D内容创建过程 156
    8.1.1 建模157
    8.1.2 纹理映射 157
    8.1.3 动画 158
    8.1.4 技术美工 159
    8.2 3D建模和动画工具 160
    8.2.1 传统3D软件 160
    8.2.2 基于浏览器的集成环境 164
    8.2.3 3D内容仓库和现成素材 167
    8.3 3D文件格式 168
    8.3.1 模型格式 168
    8.3.2 动画格式 170
    8.3.3 全功能的场景格式 171
    8.4 加载3D内容到WebGL应用中 178
    8.4.1 Three.js JSON格式 179
    8.4.2 Three.js的二进制格式 184
    8.4.3 使用Three.js来加载COLLADA场景 185
    8.4.4 使用Three.js来加载gITF场景 188
    8.5 小结 189
    第9章 3D引擎和框架 190
    9.1 3D框架概念 191
    9.1.1 什么是框架 191
    9.1.2 WebGL框架需求 192
    9.2 WebGL框架概况 194
    9.2.1 游戏引擎 194
    9.2.2 展示框架 196
    9.3 Vizi:一个基于组件的用于可视化Web应用的框架 198
    9.3.1 背景和设计理念 199
    9.3.2 Vizi架构 200
    9.3.3 Vizi入门 201
    9.3.4 一个Vizi应用示例 202
    9.4 小结 207
    第10章 开发一个简单的3D应用 209
    10.1 设计应用 211
    10.2 创建3D 内容 212
    10.2.1 导出Maya场景到COLLADA 213
    10.2.2 将COLLADA文件转换glTF格式 214
    10.3 预览和测试3D内容 214
    10.3.1 基于Vizi的预览工具 214
    10.3.2 Vizi查看器类 216
    10.3.3 Vizi加载类 217
    10.4 将3D集成到应用中 220
    10.5 开发3D行为和交互 223
    10.5.1 Vizi 场景图API方法:findNode()和map() 223
    10.5.2 使用Vizi.FadeBehavior来动画透明度 225
    10.5.3 使用Vizi.RotateBehavior来自动旋转内容 227
    10.5.4 使用Vizi.Picker来实现鼠标悬停时显示信息 227
    10.5.5 使用用户界面来控制动画 229
    10.5.6 使用颜色选择器来改变颜色 230
    10.6 小结 232
    第11章 开发一个3D环境 233
    11.1 创建环境素材 235
    11.2 预览和测试环境 236
    11.2.1 以第一人称模式预览场景 237
    11.2.2 检查场景图 237
    11.2.3 检查对象属性 240
    11.2.4 显示边界框 242
    11.2.5 预览多个对象 244
    11.2.6 使用预览工具来查找场景中的其他问题 246
    11.3 使用skybox创建一个3D背景 247
    11.3.1 3D skybox 247
    11.3.2 Vizi skybox对象 248
    11.4 集成3D内容到应用中 250
    11.4.1 加载和初始化场景 250
    11.4.2 加载和初始化车模型 253
    11.5 实现第一人称导航 255
    11.5.1 相机控制器 256
    11.5.2 第一人称控制器中的数学 257
    11.5.3 鼠标视角 258
    11.5.4 简单碰撞检测 259
    11.6 使用多个相机 260
    11.7 创建定时的动画过渡 262
    11.8 对象行为脚本 263
    11.8.1 基于Vizi.Script实现自定义组件 264
    11.8.2 驾驶车的控制器脚本 264
    11.9 给环境添加声音 270
    11.10 渲染动态纹理 272
    11.11 小结 276
    第12章 开发移动3D应用 278
    12.1 移动3D平台 278
    12.2 为移动浏览器开发 280
    12.2.1 增加触摸支持 281
    12.2.2 在桌面版Chrome上调试移动功能 285
    12.3 创建Web应用 287
    12.3.1 Web应用开发和测试工具 287
    12.3.2 打包成Web应用来发布 288
    12.4 开发原生/HTML5混合应用 289
    12.4.1 CocoonJS:一种为移动设备构建HTML游戏及应用的技术 290
    12.4.2 使用CocoonJS 组装应用 292
    12.4.3 WebGL混合开发:问题 298
    12.5 移动3D性能 298
    12.6 小结 300
    附录 资源 301
    作者介绍 311
    封面介绍 311
  • 内容简介:
    本书全面讲解了使用HTML5和WebGL开发3D应用的Web技术,理论与实践相结合,涵盖桌面和移动两端。全书分两部分:基础知识和应用开发。在详细介绍开发相关理论、工具、框架和库的基础上,作者通过3D产品浏览器、游戏和交互培训系统等案例,生动讲解了3D应用开发的全过程。
    本书适合中高级Web及页游开发人员阅读。
  • 作者简介:
    Tony Parisi

    Web 3D标准的先驱、企业家、CTO、架构师。VRML和X3D语言的联合作者,这两者已经成为Web 3D图形的ISO标准。另著有《WebGL入门指南》。

    潘征

    网名此方,目前就职于百度FEX前端研发团队,专注前端复杂应用研发。
  • 目录:
    目录

    前言  xi
    第一部分 基础知识
    第1章 绪论 2
    1.1 HTML5:新型的视觉媒介 4
    1.1.1 浏览器平台 4
    1.1.2 浏览器支持情况 6
    1.2 3D图形的基础知识 6
    1.2.1 什么是3D 6
    1.2.2 3D坐标系 7
    1.2.3 网格、多边形与顶点 8
    1.2.4 材质、纹理与光源 9
    1.2.5 变换与矩阵 9
    1.2.6 相机、透视、视口与投影 10
    1.2.7 着色器 11
    第2章 WebGL:实时3D渲染 13
    2.1 WebGL基础 14
    2.2 WebGL API 15
    2.3 WebGL应用剖析 16
    2.4 一个简单的WebGL示例 16
    2.4.1 Canvas 元素和WebGL 绘图上下文 17
    2.4.2 视口 18
    2.4.3 缓冲、缓冲数组和类型化数组 18
    2.4.4 矩阵 19
    2.4.5 着色器 20
    2.4.6 绘制图元 22
    2.5 创建3D几何体 23
    2.6 添加动画 27
    2.7 使用纹理映射 28
    2.8 小结 34
    第3 章 Three.js——一款JavaScript 3D引擎 35
    3.1 使用Three.js创建的代表性项目 35
    3.2 Three.js概览 38
    3.2.1 初始化Three.js 40
    3.2.2 Three.js工程结构 40
    3.3 一个简单的Three.js程序 41
    3.3.1 创建渲染器 43
    3.3.2 创建场景 43
    3.3.3 运行循环的实现 45
    3.3.4 为场景添加光照 46
    3.4 小结 48
    第4章 Three.js中的图形和渲染 49
    4.1 几何图形和网格 49
    4.1.1 预置的几何形状类型 49
    4.1.2 路径、形状和挤出 50
    4.1.3 几何形状基础类 52
    4.1.4 用于优化网格渲染的BufferGeometry 55
    4.1.5 从建模软件包中导入网格数据 56
    4.2 场景图和空间变换的层级结构 57
    4.2.1 利用场景图来管理复杂场景 57
    4.2.2 Three.js 中的场景图 57
    4.2.3 平移、旋转和缩放的表示 61
    4.3 材质 61
    4.3.1 标准网格材质 61
    4.3.2 使用多重纹理增添逼真效果 63
    4.4 光源 67
    4.5 阴影 69
    4.6 着色器 73
    4.6.1 ShaderMaterial类:编写你自己的着色器代码 74
    4.6.2 在Three.js 中使用GLSL着色器代码 75
    4.7 渲染 78
    4.7.1 后处理和多道渲染 79
    4.7.2 延迟渲染 80
    4.8 小结 80
    第5章 3D动画 81
    5.1 使用requestAnimationFrame()来驱动动画 82
    5.1.1 在你的应用中使用requestAnimationFrame() 83
    5.1.2 requestAnimationFrame()和性能 84
    5.1.3 基于帧的动画和基于时间的动画 85
    5.2 使用程序更新属性的方式来构建动画 85
    5.3 使用补间来进行动画过渡 87
    5.3.1 插值 87
    5.3.2 Tween.js库 88
    5.3.3 缓动 90
    5.4 使用关键帧来实现复杂动画 91
    5.4.1 Keyframe.js——一个简单的帧动画通用库 92
    5.4.2 使用关键帧创建关节动画 94
    5.5 使用曲线和路径创建平滑自然的运动 96
    5.6 使用变形目标来创建人物和面部动画 99
    5.7 使用蒙皮来构建角色动画 100
    5.8 使用着色器来进行动画 104
    5.9 小结 109
    第6章 CSS3:高级页面效果 110
    6.1 CSS变换 112
    6.1.1 使用3D变换 113
    6.1.2 添加透视 115
    6.1.3 创建变换层级 117
    6.1.4 控制背面渲染 119
    6.1.5 CSS变换属性汇总 122
    6.2 CSS过渡 122
    6.3 CSS动画 127
    6.4 挑战CSS的极限 130
    6.4.1 渲染3D物体 130
    6.4.2 渲染3D环境 132
    6.4.3 使用CSS自定义滤镜来实现高级着色器效果 134
    6.4.4 用Three.js来渲染CSS 3D 135
    6.5 小结 135
    第7章 Canvas:通用2D绘图 137
    7.1 Canvas基础 137
    7.1.1 Canvas元素和2D绘图上下文 138
    7.1.2 Canvas API的功能 139
    7.2 使用Canvas API来渲染3D 144
    7.3 基于Canvas渲染的3D库 147
    7.3.1 K3D 147
    7.3.2 Three.js的Canvas渲染 148
    7.4 小结 153
    第二部分 应用开发技术
    第8 章 3D内容制作流程 156
    8.1 3D内容创建过程 156
    8.1.1 建模157
    8.1.2 纹理映射 157
    8.1.3 动画 158
    8.1.4 技术美工 159
    8.2 3D建模和动画工具 160
    8.2.1 传统3D软件 160
    8.2.2 基于浏览器的集成环境 164
    8.2.3 3D内容仓库和现成素材 167
    8.3 3D文件格式 168
    8.3.1 模型格式 168
    8.3.2 动画格式 170
    8.3.3 全功能的场景格式 171
    8.4 加载3D内容到WebGL应用中 178
    8.4.1 Three.js JSON格式 179
    8.4.2 Three.js的二进制格式 184
    8.4.3 使用Three.js来加载COLLADA场景 185
    8.4.4 使用Three.js来加载gITF场景 188
    8.5 小结 189
    第9章 3D引擎和框架 190
    9.1 3D框架概念 191
    9.1.1 什么是框架 191
    9.1.2 WebGL框架需求 192
    9.2 WebGL框架概况 194
    9.2.1 游戏引擎 194
    9.2.2 展示框架 196
    9.3 Vizi:一个基于组件的用于可视化Web应用的框架 198
    9.3.1 背景和设计理念 199
    9.3.2 Vizi架构 200
    9.3.3 Vizi入门 201
    9.3.4 一个Vizi应用示例 202
    9.4 小结 207
    第10章 开发一个简单的3D应用 209
    10.1 设计应用 211
    10.2 创建3D 内容 212
    10.2.1 导出Maya场景到COLLADA 213
    10.2.2 将COLLADA文件转换glTF格式 214
    10.3 预览和测试3D内容 214
    10.3.1 基于Vizi的预览工具 214
    10.3.2 Vizi查看器类 216
    10.3.3 Vizi加载类 217
    10.4 将3D集成到应用中 220
    10.5 开发3D行为和交互 223
    10.5.1 Vizi 场景图API方法:findNode()和map() 223
    10.5.2 使用Vizi.FadeBehavior来动画透明度 225
    10.5.3 使用Vizi.RotateBehavior来自动旋转内容 227
    10.5.4 使用Vizi.Picker来实现鼠标悬停时显示信息 227
    10.5.5 使用用户界面来控制动画 229
    10.5.6 使用颜色选择器来改变颜色 230
    10.6 小结 232
    第11章 开发一个3D环境 233
    11.1 创建环境素材 235
    11.2 预览和测试环境 236
    11.2.1 以第一人称模式预览场景 237
    11.2.2 检查场景图 237
    11.2.3 检查对象属性 240
    11.2.4 显示边界框 242
    11.2.5 预览多个对象 244
    11.2.6 使用预览工具来查找场景中的其他问题 246
    11.3 使用skybox创建一个3D背景 247
    11.3.1 3D skybox 247
    11.3.2 Vizi skybox对象 248
    11.4 集成3D内容到应用中 250
    11.4.1 加载和初始化场景 250
    11.4.2 加载和初始化车模型 253
    11.5 实现第一人称导航 255
    11.5.1 相机控制器 256
    11.5.2 第一人称控制器中的数学 257
    11.5.3 鼠标视角 258
    11.5.4 简单碰撞检测 259
    11.6 使用多个相机 260
    11.7 创建定时的动画过渡 262
    11.8 对象行为脚本 263
    11.8.1 基于Vizi.Script实现自定义组件 264
    11.8.2 驾驶车的控制器脚本 264
    11.9 给环境添加声音 270
    11.10 渲染动态纹理 272
    11.11 小结 276
    第12章 开发移动3D应用 278
    12.1 移动3D平台 278
    12.2 为移动浏览器开发 280
    12.2.1 增加触摸支持 281
    12.2.2 在桌面版Chrome上调试移动功能 285
    12.3 创建Web应用 287
    12.3.1 Web应用开发和测试工具 287
    12.3.2 打包成Web应用来发布 288
    12.4 开发原生/HTML5混合应用 289
    12.4.1 CocoonJS:一种为移动设备构建HTML游戏及应用的技术 290
    12.4.2 使用CocoonJS 组装应用 292
    12.4.3 WebGL混合开发:问题 298
    12.5 移动3D性能 298
    12.6 小结 300
    附录 资源 301
    作者介绍 311
    封面介绍 311
查看详情
系列丛书 / 更多
HTML5与WebGL编程
机器学习实战
[美]Peter Harrington 著;李锐、李鹏、曲亚东 译
HTML5与WebGL编程
图灵程序设计丛书:Python基础教程
[挪威]Magnus Lie Hetland 著;司维、曾军崴、谭颖华 译
HTML5与WebGL编程
JavaScript高级程序设计(第3版)
[美]Nicholas C.Zakas 著;李松峰、曹力 译
HTML5与WebGL编程
Python编程:从入门到实践
[美]埃里克·马瑟斯(Eric Matthes) 著;袁国忠 译
HTML5与WebGL编程
R语言实战(第2版)
[美]卡巴科弗(Robert I. Kabacoff) 著;王小宁、刘撷芯、黄俊文 译
HTML5与WebGL编程
算法(第4版)
[美]Robert、[美]Kevin Wayne 著;谢路云 译
HTML5与WebGL编程
大数据:互联网大规模数据挖掘与分布式处理
[美]Anand、[美]Jeffrey David Ullman 著;王斌 译
HTML5与WebGL编程
Spark快速大数据分析
[美]卡劳(Holden Karau)、[美]肯维尼斯科(Andy Konwinski)、[美]温德尔(Patrick Wendell)、[加拿大]扎哈里亚(Matei Zaharia) 著;王道远 译
HTML5与WebGL编程
图解HTTP
[日]上野·宣 著;于均良 译
HTML5与WebGL编程
MySQL必知必会
[英]福塔(Ben Forta) 著;刘晓霞、钟鸣 译
HTML5与WebGL编程
Objective-C基础教程 第2版
[美]Scott、[美]Waqar、[美]Mark Dalrymple 著;周庆成 译
HTML5与WebGL编程
算法图解
袁国忠 译
您可能感兴趣 / 更多
HTML5与WebGL编程
猎物《纽约时报》畅销书作者史黛西·威林厄姆 Goodreads年度悬疑惊悚小说 LibraryReads月度值得关注图书
[美]史黛西·威林厄姆著
HTML5与WebGL编程
纳博科夫短篇小说全集(纳博科夫精选集V)
[美]弗拉基米尔·纳博科夫著
HTML5与WebGL编程
你和我真的太像啦!(奇想国童书)
[美]安妮·拜罗斯/著;
HTML5与WebGL编程
海外中国研究·寻找六边形:中国农村的市场和社会结构(海外中国研究丛书精选版第四辑)
[美]施坚雅 著;徐秀丽 译;史建云
HTML5与WebGL编程
杰出投资者的底层认知:成功投资与明智创富的10个茅塞顿开之问(《聪明的投资者》新时代精华版)
[美]J.戴维·斯坦恩(J.David Stein) 著;刘寅龙 译;庞鑫
HTML5与WebGL编程
巴菲特致管理者的信:价值投资和公司治理经典教程(如实呈现从未发表的巴菲特致运通公司原始信件)
[美]杰夫·格拉姆(Jeff Gramm) 著;路本福 译;陈祺祺
HTML5与WebGL编程
德川时代的宗教
[美]罗伯特·N.贝拉 著
HTML5与WebGL编程
小屁孩日记(平装双语版)35-36奶狗肠大作战和一日校长记 全2册
[美]杰夫·金尼(Jeff Kinney)
HTML5与WebGL编程
洛丽塔原型:小说《洛丽塔》背后的萨莉?霍纳绑架案
[美]萨拉·魏恩曼 著;真故图书 出品
HTML5与WebGL编程
鸡蛋的胜利和其他故事(安德森教科书级别的短篇典范,一枚鸡蛋引发的“美国梦”的幻灭!)
[美]舍伍德·安德森
HTML5与WebGL编程
拖延心理学:从心理学的角度看拖延,跨越“想做”与“做”的鸿沟,赢回内驱力、专注力、执行力!
[美]海登·芬奇 著;张紫钰 译;斯坦威 出品
HTML5与WebGL编程
治疗性催眠的本质(艾瑞克森催眠治疗大典)
[美]Milton H. Erickson(美) Ernest L. Rossi(美) Roxanna Erickson-Klein