HTML5与WebGL编程 封面

HTML5与WebGL编程

暂无评分
字数
48.7万字
章节数
40
丛书
图灵程序设计丛书
ISBN
9787115421333

标签

内容简介

本书是美国 Web 3D 先驱、VRML 与 X3D 语言联合作者 Tony Parisi 的作品,中文版由人民邮电出版社于 2016 年作为“图灵程序设计丛书”之一引进出版,译者为曾任职于百度 FEX 前端团队的潘征。全书面向已有 JavaScript 与 HTML 基础的开发者,系统讲解如何用 HTML5 相关技术栈在浏览器中构建 3D 应用,涵盖桌面端与移动端两种场景。 全书分为两大部分。第一部分“基础知识”从 HTML5 作为新型视觉媒介讲起,介绍浏览器平台与兼容性现状、3D 图形的基本概念(坐标系、网格与多边形、材质纹理与光源、变换与矩阵、相机与投影、着色器),随后深入 WebGL 的实时渲染机制:绘图上下文、视口、缓冲与类型化数组、着色器编写与图元绘制,并完整走通一个简单的 WebGL 示例。接着引入 JavaScript 3D 引擎 Three.js,讲解工程结构、渲染器、场景、运行循环与光照,并延伸到几何体与网格、场景图与变换层级、材质与贴图、灯光与阴影、自定义着色器与后期处理。此外还讨论了 requestAnimationFrame 驱动的动画、补间与关键帧、CSS3 3D 变换与滤镜、Canvas 2D 绘制与 Canvas 渲染器等内容。 第二部分“应用开发”转向实战,涉及 3D 内容生产流程与建模动画工具、游戏引擎与框架(包括作者本人的 Vizi 框架),并通过 3D 产品浏览器、游戏和交互式培训系统等案例,演示多物体复杂场景与交互的实现,最后专门分析移动浏览器上 WebGL 应用的性能与适配问题。 全书 311 页、约 48.7 万字,重理论亦重实践,适合中高级 Web 开发者和页游开发者系统学习网页 3D 技术。

编辑推荐

Web 上做 3D,最容易踩的坑不是“不会写 GLSL”,而是“不知道 HTML5 这一整套技术栈各自该管哪一段”。这本书的价值正体现在把这条链路打通:Canvas 拿绘图上下文,WebGL 负责实时渲染,Three.js 提供场景图与材质体系,CSS3 兜底 UI 与轻量 3D 效果,最后用 Tween.js、Keyframe.js 之类的小工具把动画串起来。作者 Tony Parisi 是 VRML 与 X3D 的联合作者,这两者已成为 Web 3D 图形的 ISO 标准,他对“Web 3D 该长成什么样”有第一手判断,行文不像很多图形学教材那样一头扎进矩阵推导,而是始终围绕“浏览器里能跑起来的东西”。 结构上也体贴:第一部分打地基,从 3D 概念到 WebGL 最小示例再到 Three.js 的几何体、材质、灯光、阴影、自定义着色器与后期处理,每一步都有可运行的代码;第二部分直接上案例,3D 内容管线的讲解尤其少见——很多人会写渲染循环,却不知道模型从建模软件导出来之后要走哪些工序。最后一章专讲移动端 WebGL,涉及性能与适配,这在当年相当超前。 需要提醒的是,本书原版出版于 2014 年,中文版 2016 年引进,示例基于当年的 Three.js 版本与老式 API,今天照抄代码大概率要改。但渲染管线、场景图、材质与贴图、动画驱动方式这些底层认知并不过时,把它当作“Web 3D 的体系入门 + Three.js 概念地图”来读,性价比仍然很高。译者潘征出身百度 FEX 前端团队,术语处理稳妥,读起来不别扭。

适合谁读

适合

  • 有两三年 JavaScript 与 HTML 经验、想转向网页 3D 开发的前端工程师
  • 做页游或 Web 互动项目,需要评估 Three.js、Canvas、CSS3 技术选型的开发者
  • 计算机相关专业学生,想通过可运行示例理解 3D 渲染管线与着色器
  • 需要为产品展示、在线培训等场景搭建 3D 交互应用的技术负责人

不适合

  • 完全没有 JavaScript 基础的编程零起点读者
  • 想查找最新 Three.js 版本 API 或 WebGPU 内容的读者,本书版本已明显陈旧
  • 只需做 2D 页面排版与样式、不涉及图形渲染的从业者

阅读建议

  1. 先读第 1 章的 3D 图形基础概念,矩阵与相机部分不必一次学透,留到第 2 章示例中回看。
  2. 务必动手跑通第 2 章的 WebGL 最小示例,理解缓冲区、着色器与绘制图元三步流程,再看 Three.js 会轻松很多。
  3. 读第 3 至 5 章时,边读边把示例迁移到当前版本的 Three.js 上,遇到 API 差异就查官方文档,这本身就是很好的练习。
  4. 第 8 至 12 章的应用开发部分可以不按顺序读,挑与自己项目最接近的案例(产品浏览器、游戏或培训系统)优先实践。

出版社简介

人民邮电出版社 中国 · 成立于 1953 年

人民邮电出版社以科技、计算机与信息通信类图书见长,并由此延伸至摄影、艺术、软件学习与励志成长等门类,形成较为多元的出版方向。库内图书既涵盖《重构与模式(修订版)》《华为交换机学习指南(第二版)》等计算机与通信技术读物,也收录《小王子(中英法彩绘典藏纪念版)》《了不起的盖茨比》《假如给我三天光明》等双语典藏类作品;《北京十年:1980-1990》与《鬼刀 WLOP个人插画作品集》则体现其在摄影与艺术领域的布局。作者资源包括安东尼·圣埃克苏佩里、海伦·凯勒、Joshua Kerievsky、王达、张兆增与WLOP等。

目录

  1. 前言
  2. 第一部分 基础知识
  3. 第1章 绪论
  4. 1.1 HTML5:新型的视觉媒介
  5. 1.1.1 浏览器平台
  6. 1.1.2 浏览器支持情况
  7. 1.2 3D图形的基础知识
  8. 1.2.1 什么是3D
  9. 1.2.2 3D坐标系
  10. 1.2.3 网格、多边形与顶点
  11. 1.2.4 材质、纹理与光源
  12. 1.2.5 变换与矩阵
  13. 1.2.6 相机、透视、视口与投影
  14. 1.2.7 着色器
  15. 第2章 WebGL:实时3D渲染
  16. 2.1 WebGL基础
  17. 2.2 WebGL API
  18. 2.3 WebGL应用剖析
  19. 2.4 一个简单的WebGL示例
  20. 2.4.1 Canvas元素和WebGL绘图上下文
  21. 2.4.2 视口
  22. 2.4.3 缓冲、缓冲数组和类型化数组
  23. 2.4.4 矩阵
  24. 2.4.5 着色器
  25. 2.4.6 绘制图元
  26. 2.5 创建3D几何体
  27. 2.6 添加动画
  28. 2.7 使用纹理映射
  29. 2.8 小结
  30. 第3章 Three.js——一款JavaScript 3D引擎
  31. 3.1 使用Three.js创建的代表性项目
  32. 3.2 Three.js概览
  33. 3.2.1 初始化Three.js
  34. 3.2.2 Three.js工程结构
  35. 3.3 一个简单的Three.js程序
  36. 3.3.1 创建渲染器
  37. 3.3.2 创建场景
  38. 3.3.3 运行循环的实现
  39. 3.3.4 为场景添加光照
  40. 3.4 小结

常见问题

这本书的原版是哪一本,中文版是完整翻译吗?
原版是 Tony Parisi 所著、O'Reilly 于 2014 年出版的《Programming 3D Applications with HTML5 and WebGL》。中文版由潘征翻译,人民邮电出版社 2016 年出版,属“图灵程序设计丛书”,全书 311 页、约 48.7 万字,两部分共 12 章,内容对应完整。
书里的代码今天还能直接运行吗?
原书示例基于 2014 年前后的 Three.js、Tween.js 等库版本,直接照抄很可能报错,尤其是几何体构造、材质与着色器相关 API 已有较大变化。建议理解思路后改写为当前版本,或参照作者在 GitHub 上公开的示例代码做相应调整。
读这本书需要先学图形学吗?
不需要。第 1 章专门用一节讲 3D 坐标系、网格与顶点、材质纹理与光源、变换矩阵、相机与投影、着色器等基本概念,属于面向开发者的简明导引。但需要具备 JavaScript 与 HTML 基础,否则示例代码会读不懂。
这本书和《WebGL编程指南》有什么区别?
《WebGL编程指南》以原生 WebGL API 为主线,偏底层原理与逐行示例;本书则以“做出 Web 3D 应用”为目标,原生 WebGL 只占前两章,重点在 Three.js、CSS3、Canvas、动画与内容管线,覆盖面更广、更贴近工程实践。
移动端开发部分现在还适用吗?
第 12 章讨论的是移动浏览器 WebGL 的性能瓶颈、资源限制与适配策略,这类思路仍然有效;但涉及当年浏览器特性与设备限制的具体数据已经过时,建议结合如今的移动端实测情况参考。

读者评论

查询本书

本站为索引目录:「全网查询」由您发起、在您的浏览器中运行,所列入口均指向第三方站点,请自行判断可用性。

同类高分