WebGL编程指南
相关资料
[
“webgl 提供了用以在浏览器中创建‘具有桌面应用体验’的应用的最终特性，而《webgl 编程指南》将教会你如何创建这些应用。这本书涵盖了使用webgl 的方方面面——javascript、opengl es，以及基础的图形学技术——如果你想上手webgl，这本书里有你需要的一切。web 应用是未来的趋势，这本书将让你走在潮流的前端！”
——dave shreiner
《opengl 编程指南》( 第8 版) 的作者，addison wesley 出版社opengl 系列丛书编辑
“html5 使web 成为了高度可用的应用平台，使精致优美的web 应用能够运行在多种不同的系统中。webgl 是html5 的一个重要组成部分，它允许web 开发者充分利用硬件的性能渲染三维图形。webgl 被设计出来的目的就是为了安全地运行在任何支持web 的系统中，这项技术将在三维web 内容和应用、用户界面等领域引发新一轮的技术
革命。这本书将帮助web 开发者完全理解webgl 技术的功能，并牢牢抓住这项技术带来的机遇。”
——neil trevett
nvidia 移动部门副总裁，khronos 小组主席
“通过优美的三维渲染和清晰的讲解，这本书将webgl 这样一个复杂晦涩的问题变得亲切有趣。不可否认的是，webgl 确实非常复杂，但这本书已经足够畅达，初学者应该毫不犹豫地利用它开始学习。”
——evan burchard
web game developer’s cookbook (addison wesley) 的作者
“本书的两位作者都具有深厚的opengl 背景，并将此背景恰到好处地用在了webgl 上，写出了这本优秀的，即适合新手也适合老鸟的教材。”
——daniel heahn
波士顿儿童医院的软件工程师
“《webgl 编程指南》以一种即直接又通俗易懂的方式，讲解了如何不依赖笨重的函数库或插件来构建三维应用。对希望了解最前沿的三维web 开发领域的工程师来说，这是一本不可多得的好书。”
——brandon jones
google 的软件工程师
“这是一部出自杰出科学家之手的伟大作品。kouichi matsuda 清晰简洁地向初学者指明了理解webgl 所需经历的道路。这是一个复杂的话题，使得每一个刚开始使用这项新技术的人都能够理解。这本书包括了很多三维的基本概念，以帮助读者理解后面的知识。对任何一个web 开发者来说，这本书都值得收藏。”
——chris marrin
webgl spec 编辑
“学习《webgl 编程指南》是从webgl 菜鸟到webgl 专家的绝佳途径。webgl 虽然概念上很简单，但真正使用它需要大量3d 数学知识，《webgl 编程指南》系统地帮你总结了这些知识，你只需要好好理解它们并运用到实际开发中去。即使你最后还是选择使用webgl 3d 库，《webgl 编程指南》里学到的知识也会帮助你理解那些库究竟在做些什么，并允许你将它们进行改造，以适应你的应用的特殊要求。真见鬼，你最终还是坚持使用opengl 和/ 或directx 编写桌面程序？即使这样，《webgl 编程指南》也是一本不错的入门书，因为市面上大多关于3d 的书籍，与目前的3d 技术相比都已经过时了。总之，《webgl 编程指南》将帮助你完整理解关于现代3d 图形学的基础知识。”
——gregg tavares
google 的软件工程师，chrome 浏览器webgl 系统的实现者
]
本书特色
[
webgl 是一项在网页上渲染三维图形的技术，也是html5 草案的一部分。
《webgl编程指南》的主要篇幅讲解了webgl 原生api 和三维图形学的基础知识，包括渲染管线、着色器、矩阵变换、着色器编程语言（glsl es）等等，也讲解了使用webgl 渲染三维场景的一般技巧，如光照、阴影、雾化等等。《webgl编程指南》提供了丰富的示例程序供读者钻研，也提供了极具价值的附录供读者参考。
《webgl编程指南》适合有一定前端开发基础，希望学习webgl，但对三维图形学缺乏了解的程序员们阅读。
]
内容简介
[
使用webgl，你可以在浏览器中，不依赖任何插件创建出精美的可交互三维图形。webgl技术使得创建新一代3d网页游戏、用户界面、数据可视化方案成为可能，这些程序能够运行任何支持标准浏览器的pc、智能手机、平板电脑、家用游戏机或其他设备上。《webgl编程指南》将会帮助你快速入门学习可交互的webgl 3d编程，即使你还不了解html5、javascript、三维图形学理论、数学基础和opengl也没有关系。
你将会一步一步地学习真实的示例程序。随着示例程序从简单变复杂，你也将逐渐掌握使用webgl开发虚拟逼真的网页和三维图形的技能。多媒体、三维图形学和webgl领域的先驱者kouichi matsuda博士和rodger lea博士在这本书中提供了易于上手、重点清晰的webgl教程，以及共计100个可下载的示例程序，每个程序都讨论了一个具体的webgl话题。
你将从*基本的技术比如渲染、动画、为三角形贴上纹理开始，一路学习到高级的webgl技术，比如雾化、阴影、切换着色器、显示由blender等建模工具创建的三维模型。这本书并不仅仅向你传授*佳的实践方法，同时也会向你提供一个小型的代码库，方便你在学习完本书后，开始编写自己的程序。
本书的内容包括：
√ webgl的起源、核心概念、特性、优势以及与其他web标准的结合；
√ canvas和基本的webgl函数如何协作以显示三维图形；
√ 使用opengl es着色器语言（glsl es）编写着色器代码；
√ 三维场景渲染：表示用户视野、控制可视空间、裁剪、三维对象创建、透视；
√ 通过光照和层次结构模型产生更真实的效果；
√ 高级技巧：对象操作，hud、混合、着色器切换等等；
√ 极具价值的附录，涵盖了从坐标系统到矩阵、从着色器加载到浏览器设置等诸多关键知识点。
]
作者简介
[
关于作者
Kouichi Matsuda 博士是多媒体产品用户界面和用户体验设计方面的专家。他先后供职于日本电气(NEC)、索尼(Sony) 研发中心、索尼(Sony) 计算机科学实验室，曾经做过产品研发，也做过科学研究，最终回到产品研发的岗位。目前，他是用户体验和人机交互领域的首席研究员，负责多款消费类电子产品的设计。他曾经设计了社交三维虚拟世界“PAW”，也曾经参与过VRML97(ISO/IEC 14772-1:1997) 标准的开发工作，在VRML和X3D(WebGL 的前身) 社区中仍然非常活跃。他撰写过15 本计算机技术的书籍，并翻译过25 本相关书籍。他专长于用户体验、用户界面、人机交互、自然语言处理和面向娱乐的网络设备，以及接口代理系统等领域。他不仅对技术领域的新鲜事物充满热情，还热衷于温泉、夏季的海滩、红酒和漫画（为此他已经沉迷于绘制插画一段时间了）。他在东京大学工程系获得了博士学位，你可以通过WebGL.prog.guide@gmail.com 联系他。
Rodger Lea 博士是卑诗大学媒体与图像跨学科中心的兼职教授，对多媒体和分布式计算等领域很感兴趣。他和他带领的研究小组在学术和工业领域耕耘超过20 年，参与制定了VRML97 标准，开发了多媒体操作系统、可交互数字电视原型，并领导了家用多媒体网络标准的制定工作。他发表了60 多篇学术论文，著有3 本技术书籍，并拥有12 项专利。目前，他的研究集中在探索发展中的互联网，但他仍然对有关多媒体和图形学的一切抱有热情。
关于译者
谢光磊，毕业于南京大学，目前为中科院在读硕士，即将成为淘宝UED 的一名前端工程师。因一次偶然的机会接触WebGL 而对其萌生兴趣，并愿意持久深入地研究这项技术。个人站点为 www.xieguanglei.com。
]
目录
第1 章 webgl 概述 webgl 的优势使用文本编辑器开发三维应用轻松发布三维图形程序充分利用浏览器的功能学习和使用webgl 很简单webgl 的起源webgl 程序的结构总结第2 章 webgl 入门 canvas 是什么？使用标签drawrectanglejs*短的webgl 程序：清空绘图区html 文件（hellocanvashtml）javascript 程序（hellocanvasjs）用示例程序做实验绘制一个点（版本1）hellopoint1htmlhellopoint1js着色器是什么？使用着色器的webgl 程序的结构初始化着色器顶点着色器片元着色器绘制操作webgl 坐标系统用示例程序做实验绘制一个点（版本2）使用attribute 变量示例程序（hellopoint2js）获取attribute 变量的存储位置向attribute 变量赋值glvertexattrib3f() 的同族函数用示例程序做实验通过鼠标点击绘点示例程序（clickedpointsjs）注册事件响应函数响应鼠标点击事件用示例程序做实验改变点的颜色示例程序（coloredpointsjs）uniform 变量获取uniform 变量的存储地址向uniform 变量赋值gluniform4f() 的同族函数总结第3 章 绘制和变换三角形 绘制多个点示例程序（multipointjs）使用缓冲区对象创建缓冲区对象（glcreatebuffer()）绑定缓冲区（glbindbuffer()）向缓冲区对象中写入数据（glbufferdata()）类型化数组将缓冲区对象分配给attribute 变量（glvertexattribpointer()）开启attribute 变量（glenablevertexattribarray()）gldrawarrays() 的第2 个和第3 个参数用示例程序做实验hello triangle示例程序（hellotrianglejs）基本图形用示例程序做实验hello rectangle（helloquad）用示例程序做实验移动、旋转和缩放平移示例程序（translatedtrianglejs）旋转示例程序（rotatedtrianglejs）变换矩阵：旋转变换矩阵：平移4×4 的旋转矩阵示例程序（rotatedtriangle_matrixjs）平移：相同的策略变换矩阵：缩放总结第4 章 高级变换与动画基础 平移，然后旋转矩阵变换库：cuon-matrixjs示例程序（rotatedtriangle_matrix4js） 复合变换示例程序（rotatedtranslatedtrianglejs）用示例程序做实验动画动画基础示例程序（rotatingtrianglejs）反复调用绘制函数（tick()）按照指定的旋转角度绘制三角形（draw()）请求再次被调用（requestanimationframe()）更新旋转角（animate()）用示例程序做实验总结第5 章 颜色与纹理 将非坐标数据传入顶点着色器示例程序（multiattributesizejs）创建多个缓冲区对象glvertexattribpointer() 的步进和偏移参数示例程序（multiattributesize_interleavedjs）修改颜色（varying 变量）示例程序（multiattributecolorjs）用示例程序做实验彩色三角形（coloredtrianglejs）几何形状的装配和光栅化调用片元着色器用示例程序做实验varying 变量的作用和内插过程在矩形表面贴上图像纹理坐标将纹理图像粘贴到几何图形上示例程序（texturedquadjs）设置纹理坐标（initvertexbuffers()）配置和加载纹理（inittextures()）为webgl 配置纹理（loadtexture()）图像y 轴反转激活纹理单元（glactivetexture()）绑定纹理对象（glbindtexture()）配置纹理对象的参数（gltexparameteri()）将纹理图像分配给纹理对象（glteximage2d()）将纹理单元传递给片元着色器（gluniform1i()）从顶点着色器向片元着色器传输纹理坐标在片元着色器中获取纹理像素颜色（texture2d()）用示例程序做试验使用多幅纹理示例程序（multitexturejs）总结第6 章 opengl es 着色器语言（glsl es） 回顾：基本着色器代码glsl es 概述你好，着色器！基础执行次序注释数据值类型（数值和布尔值）变量glsl es 是强类型语言基本类型赋值和类型转换运算符矢量和矩阵赋值和构造访问元素运算符结构体赋值和构造访问成员运算符数组取样器（纹理）运算符优先级程序流程控制：分支和循环if 语句和if-else 语句for 语句continue、break 和discard 语句函数规范声明参数限定词内置函数全局变量和局部变量存储限定字const 变量attribute 变量uniform 变量varying 变量精度限定字预处理指令总结第7 章 进入三维世界 立方体由三角形构成视点和视线视点、观察目标点和上方向 示例程序（lookattrianglesjs）lookattrianglesjs 与rotatedtriangle_matrix4js从指定视点观察旋转后的三角形示例程序（lookatrotatedtrianglesjs）用示例程序做实验利用键盘改变视点示例程序（lookattriangleswithkeysjs）独缺一角可视范围（正射类型）可视空间定义盒状可视空间示例程序（orthoviewhtml）示例程序（orthoviewjs）javascript 修改html 元素顶点着色器的执行流程修改near 和far 值补上缺掉的角（lookattriangleswithkeys_viewvolumejs）用示例程序做实验可视空间（透视投影）定义透视投影可视空间示例程序（perspectiveviewjs）投影矩阵的作用共冶一炉（模型矩阵、视图矩阵和投影矩阵）示例程序（perspectiveview_mvpjs）用示例程序做实验正确处理对象的前后关系隐藏面消除示例程序（depthbufferjs）深度冲突立方体通过顶点索引绘制物体示例程序（hellocubejs）向缓冲区中写入顶点的坐标、颜色与索引为立方体的每个表面指定颜色示例程序（coloredcubejs）用示例程序做实验总结第8 章 光照 光照原理光源类型反射类型平行光下的漫反射根据光线和表面的方向计算入射角法线：表面的朝向示例程序（lightedcubejs）环境光下的漫反射示例程序（lightedcube_ambientjs）运动物体的光照效果魔法矩阵：逆转置矩阵示例程序（lightedtranslatedrotatedcubejs）点光源光示例程序（pointlightedcubejs）更逼真：逐片元光照示例程序（pointlightedcube_perfragmentjs）总结第9 章 层次模型 多个简单模型组成的复杂模型层次结构模型单关节模型示例程序（jointmodejs）绘制层次模型（draw()）多节点模型示例程序（multijointmodeljs）绘制部件（drawbox()）绘制部件（drawsegments()）着色器和着色器程序对象：initshaders() 函数的作用创建着色器对象（glcreateshader()）指定着色器对象的代码（glshadersource()）编译着色器（glcompileshader()）创建程序对象（glcreateprogram()）为程序对象分配着色器对象（glattachshader()）连接程序对象（gllinkprogram()）告知webgl 系统所使用的程序对象（gluseprogram()）initshaders() 函数的内部流程总结第10 章 高级技术 用鼠标控制物体旋转如何实现物体旋转示例程序（rotateobjectjs）选中物体如何实现选中物体示例程序（pickobjectjs）选中一个表面示例程序（pickfacejs）hud（平视显示器）如何实现hud示例程序（hudhtml）示例程序（hudjs）在网页上方显示三维物体雾化（大气效果）如何实现雾化示例程序（fogjs）使用w 分量（fog_wjs）绘制圆形的点如何实现圆形的点示例程序（roundedpointjs）α 混合如何实现α 混合示例程序（lookatblendedtrianglesjs）混合函数半透明的三维物体（blendedcubejs）透明与不透明物体共存切换着色器如何实现切换着色器示例程序（programobjectjs）渲染到纹理帧缓冲区对象和渲染缓冲区对象如何实现渲染到纹理示例程序（framebufferobjectjs）创建帧缓冲区对象（glcreateframebuffer()）创建纹理对象并设置其尺寸和参数创建渲染缓冲区对象（glcreaterenderbuffer()）绑定渲染缓冲区并设置其尺寸（glbindrenderbuffer()，glrenderbufferstorage()）将纹理对象关联到帧缓冲区对象（glbindframebuffer()，glframebuffertexture2d()）将渲染缓冲区对象关联到帧缓冲区对象（glframebufferrenderbuffer()）检查帧缓冲区的配置（glcheckframebufferstatus()）在帧缓冲区进行绘图绘制阴影如何实现阴影示例程序（shadowjs）提高精度示例程序（shadow_highpjs）加载三维模型obj 文件格式mtl 文件格式示例程序（objviewerjs）自定义类型对象示例程序（objviewerjs 解析数据部分）响应上下文丢失如何响应上下文丢失示例程序（rotatingtriangle_contextlostjs）总结附录a webgl 中无须交换缓冲区 附录b glsl es 10 内置函数 角度和三角函数指数函数通用函数几何函数矩阵函数矢量函数纹理查询函数附录c 投影矩阵 正射投影矩阵透视投影矩阵附录d webgl/opengl ：左手还是右手坐标系？ 示例程序(coordinatesystemjs)隐藏面消除和裁剪坐标系统裁剪坐标系和可视空间什么是对的？总结附录e 逆转置矩阵 附录f 从文件中加载着色器 附录g 世界坐标系和本地坐标系 本地坐标系世界坐标系变换与坐标系附录h webgl 的浏览器设置
封面
书名:WebGL编程指南
作者:松田浩一
页数:470
定价:¥98.0
出版社:电子工业出版社
出版日期:2014-06-01
ISBN:9787121229428
PDF电子书大小:128MB 高清扫描完整版