《WebGL编程指南》学习笔记——1.WebGL概述

此系列用来记录我学习《WebGL编程指南》这本书后的心得,重点内容和总结

  • WebGL编程指南学习笔记1WebGL概述

    • WebGL概述
    • WebGL起源

WebGL概述

  WebGL,是一项用来在网页上绘制和渲染复杂三维图形(3D图形),并允许用户与之交互的技术。随着个人计算机和浏览器的性能越来越强,我们能够在Web上创建越来越精美、越来越复杂的3D图形。http://webglsamples.org/ 这个网址展示了Google发布的一些示例WebGL程序,在惊叹美轮美奂的效果的同时,我们发现发布和运行也变得非常简单。

  从传统意义上来说,为了显示三维图形,开发者需要使用C或C++语言,辅以专门的计算机图形库,如OpenGL或Direct3D,来开发一个独立的应用程序。现在有了WebGL,我们只需要向已经熟悉的HTML和JS中添加一些额外的三维图形学的代码,就可以在网页上显示三维图形了。

  WebGL是内嵌在浏览器中的,你不必安装插件和库就可以直接使用它。而且,因为它是基于浏览器的,你可以在多种平台上运行WebGL程序,而且使用起来有诸多便利点:

  • 你只需要一个文本编辑器和一个浏览器,就可以开始编写三维图形程序了。
  • 你可以使用通用的Web技术发布三维图形程序,展示给你的朋友和其他开发者
  • 你可以充分利用浏览器的功能。
  • 互联网上有大量现成的资料,它们可以帮助你学习WebGL,编写三维程序等。

WebGL起源

  在个人计算机上使用最广泛的两种三维图形渲染技术是Direct3DOpenGL

  Direct3D是微软DirectX技术的一部分,是一套由微软控制的编程接口API,主要用在Windows平台。
OpenGL由于其开发和免费的特性,在多种平台上都有广泛的使用。Windows对OpenGL也提供了良好的支持,开发者也可以用它来代替Direct3D。

  OpenGL最初由SGI开发,并在1992年发布为开源标准。多年以来,OpenGL发展了数个版本,并对三维图形开发,软件产品开发,甚至电影制作产生了深远影响。

  虽然WebGL根植于OpenGL,但它实际上是从OpenGL的一个特殊版本OpenGL ES中派生出来的,后者专用于嵌入式计算机、智能手机、家用游戏机等设备。OpenGL ES于2003-2004年被首次提出,并在2007年(ES 2.0)和2012年(ES 3.0)进行了两次升级,WebGL是基于OpenGL ES 2.0的

下图显示了OpenGL、OpenGL ES 1.1/2.0/3.0和WebGL的关系。

从2.0版本开始,OpenGL支持了一项非常重要的特性,即可编程着色器方法。该特性被OpenGL ES 2.0继承,并成为了WebGL 1.0标准的核心部分。

  着色器,使用一种类似于C的编程语言实现了精美的视觉效果。编写着色器的语言又称为着色器语言。WebGL基于OpenGL ES 2.0,使用GLSL ES语言编写着色器。

  虽然WebGL强大到令人惊叹,但使用这项技术进行开发却异常简单:只需要一个文本编辑器(Notepad或TextEdit)和一个浏览器(Chrome)即可;并且不需要去搭建开发环境,因为WebGL是内嵌在浏览器中的。

  下图显示了WebGL程序的结构:
  

  由于GLSL ES通常是以字符串的形式在JavaScript中编写的,所以虽然WebGL网页更加复杂,但它仍然保持着与传统的动态网页相同的结构:只用到HTML文件和JavaScript文件。
  

文章内容借鉴于:
《WebGL编程指南》
https://www.cnblogs.com/mirror-pc/p/4178897.html

《WebGL编程指南》学习笔记——1.WebGL概述相关推荐

  1. iPhone编程指南学习笔记

    为什么80%的码农都做不了架构师?>>>    UIWindow 在创建应用程序窗口时,您应该总是将其初始的边框尺寸设置为整个屏幕的大小.如果您的窗口是从nib文件装载得到,Inte ...

  2. Linux Unix shell 编程指南学习笔记(第五部分)

    第二十五章 深入讨论 << 当shell 看到 << 的时候,它知道下一个词是一个分界符.该分界符后面的内容都被当做输入,直到shell又看到该分界符(位于单独的一行).比方: ...

  3. LINUX与UNIX SHELL编程指南 学习笔记

    第1章文件安全与权限 1.2 文件类型 还记得前面一节所提到的文件权限位前面的那个字符吗?我们现在就解释一下这个横杠 所代表的意思,文件类型有七种,它可以从ls -l命令所列出的结果的第一位看出,这七 ...

  4. 【《WebGL编程指南》读书笔记-WebGL入门】

    <WebGL编程指南>读书笔记 目录链接:https://blog.csdn.net/floating_heart/article/details/124001572 第二章 WebGL入 ...

  5. 【WebGL】《WebGL编程指南》读书笔记——第2章

    一.前言 最近看了<WebGL编程指南>这本书,发现还是很有意思的,故每章阅读后做个笔记. 二.正文 Example1:在canvas中绘制2D矩形 <!DOCTYPE html&g ...

  6. 【《WebGL编程指南》读书笔记——着色器和程序对象的准备】

    本文为<WebGL编程指南>第九章下半部分读书笔记 总目录链接:https://blog.csdn.net/floating_heart/article/details/124001572 ...

  7. 【WebGL】《WebGL编程指南》读书笔记——第5章

    一.前言        终于到了第五章了,貌似开始越来越复杂了. 二.正文         Example1:使用一个缓冲区去赋值多个顶点数据(包含坐标及点大小) function initVerte ...

  8. 【WebGL编程指南】GLSL ES语法基础

    [WebGL之巅]20-GLSL ES着色器语言语法详解 查看原文:[WebGL之巅]20-GLSL ES着色器语言语法详解 对应<WebGL编程指南>第六章 GLSL ES 总览 本章知 ...

  9. WebGL three.js学习笔记 6种类型的纹理介绍及应用

    WebGL three.js学习笔记 6种类型的纹理介绍及应用 本文所使用到的demo演示: 高光贴图Demo演示 反光效果Demo演示(因为是加载的模型,所以速度会慢) (一)普通纹理 计算机图形学 ...

  10. JavaScript 权威指南-学习笔记(一)

    本文所有教程及源码.软件仅为技术研究.不涉及计算机信息系统功能的删除.修改.增加.干扰,更不会影响计算机信息系统的正常运行.不得将代码用于非法用途,如侵立删! JavaScript 权威指南-学习笔记 ...

最新文章

  1. 常用的python数值处理函数,python常用数值函数总结
  2. 机器学习 | 强化学习,解决决策问题的行家(上)
  3. Oracle Database 11.2.0.1(静默安装)
  4. js java自动部署_vue 自动化部署 jenkins 篇
  5. 服务器上运行arp,服务器ARP病毒的特征及防护说明
  6. Apple发布watchOS 5 Beta 9
  7. python随机生成验证码_Python生成随机验证码
  8. 如何对接VOLVO EDI系统?
  9. 【调度问题】基于遗传算法求解公交排班系统matlab源码
  10. 使用反相器的rc振荡电路
  11. 《web安全原理分析与实践》
  12. python math.sqrt怎么扩大倍数_Python math.sqrt方法代码示例
  13. 两个PB下使用的OfficeXP/2003风格工具栏控件
  14. 知识星球,贡献C版本,OpenSSL,GMSSL,JS版本相关国密
  15. 卡耐基:一个人的成功,只有15%是靠专业技术
  16. ls一1测距仪说明书_生产力小工具 篇一:激光测距靠谱吗?杜克LS-1激光测距仪开箱测评...
  17. hbuilderx 使用总结
  18. 网络带宽和质量测试小工具.iPerf3
  19. “三网融合”的过去、现在与未来
  20. 计算机加密恢复,系统小技巧:BitLocker密钥恢复二三事

热门文章

  1. Python--文件修改
  2. [Andriod官方API指南]连接之蓝牙
  3. js 阻止冒泡 在控件的 onxxx 事件中调用就可以阻止父控件也响应消息了
  4. ocp007 题库解析(1-15)
  5. Delphi程序结构
  6. kafka如何确定分区数
  7. 流畅的python读书笔记-第十章-序列的修改、散列和切片
  8. python小游戏之圣诞树
  9. 数据结构与算法JavaScript描述——队列
  10. c语言:【顺序表】静态顺序表的删除指定位置元素Erase、删除指定元素Remove