《WebGL编程指南》 WebGL简介

2024-04-30 10:10:03

WebGL概述

WebGL，是一项用来在网页上绘制和渲染复杂三维图形，并允许用户与之进行交互的技术。

WebGL程序的结构

WebGL页面包含了三种语言：HTML5、JavaScript、GLSL ES（openGL着色器语言）。如下图所示：

WebGL和OpenGL

WebGL的技术规范继承自免费和开源的OpenGL标准，而OpenGL是一种用于渲染2D、3D矢量图形的跨语言、跨平台的应用程序编程接口，是在个人计算机上使用最广泛的两种三维图形渲染技术之一，另一种是Direct3D。在某种意义上，WebGL就是“Web版的OpenGL”。
OpenGL最初由SGI开发，并在1992年发布为开源标准，多年来，已经发展了数个版本。虽然WebGL根植于OpenGL，但它实际上是从OpenGL的一个特殊版本OpenGL ES中派生出来的，WebGL是基于OpenGL ES 2.0的。OpenGL ES在添加新特性的同时从OpenGL中移除了许多陈旧无用的就特性，使得在保持轻量级的同时，仍然具有足够的能力来渲染出精美的三维图形。OpenGL、OpenGL ES和WebGL的关系如图所示：

从2.0版本开始，OpenGL支持了一项非常重要的特性，即可编程着色器方法，该特性被OpenGL ES 2.0继承，并成为了WebGL 1.0标准的核心部分。
编写着色器的语言称为着色器语言，OpenGL ES 2.0基于OpenGL着色器语言（GLSL），因此后者又被称为OpenGL ES着色器语言（GLSL ES）。WebGL 基于OpenGL ES 2.0，也使用GLSL ES编写着色器。

《WebGL编程指南》 WebGL简介相关推荐

【WebGL】《WebGL编程指南》读书笔记——第5章
一.前言终于到了第五章了,貌似开始越来越复杂了. 二.正文 Example1:使用一个缓冲区去赋值多个顶点数据(包含坐标及点大小) function initVerte ...
【WebGL】《WebGL编程指南》读书笔记——第2章
一.前言最近看了<WebGL编程指南>这本书,发现还是很有意思的,故每章阅读后做个笔记. 二.正文 Example1:在canvas中绘制2D矩形 <!DOCTYPE html&g ...
【《WebGL编程指南》读书笔记——着色器和程序对象的准备】
本文为<WebGL编程指南>第九章下半部分读书笔记总目录链接:https://blog.csdn.net/floating_heart/article/details/124001572 ...
【WebGL编程指南】GLSL ES语法基础
[WebGL之巅]20-GLSL ES着色器语言语法详解查看原文:[WebGL之巅]20-GLSL ES着色器语言语法详解对应<WebGL编程指南>第六章 GLSL ES 总览本章知 ...
【《WebGL编程指南》读书笔记-WebGL入门】
<WebGL编程指南>读书笔记目录链接:https://blog.csdn.net/floating_heart/article/details/124001572 第二章 WebGL入 ...
webGL编程指南实战教程
学习路线: 如果你是在校大学生,有足够的时间去学习:前端>数学(几何+线性代数)>图形学>webgl>shader >threejs>three.js源码如果你是 ...
WebGL编程指南-24 同时使用漫反射光和环境反射光、立方体平移旋转缩放变换时漫反射光和环境反射光处理
1.demo效果此效果是上一章绘制的立方体基础上,向Y轴方向平移一个单位,然后绕Z轴旋转30度. 如上图,归纳一下物体坐标变换法向量变化的规律如下平移变换, 法向量不会改变旋转变换, 大多数情况 ...
WebGL编程指南-27 逐片元处理点光源光照效果
1.demo效果如上图,图二为逐片元处理点光源的效果,与之前的demo效果相比,物体表面的光照效果更佳柔和.细腻. 2.实现要点在上一章中实现方式是逐顶点的方式,实现点光源在照射到立方体呈现出的效 ...
CoreAnimation编程指南（简介）
一.核心动画编程介绍 1.本文档介绍了在使用核心动画时所涉及的基本概念.核心动画的是Objective – C的框架,它通过简单的动画编程接口来提供一套高性能的动画引擎. 2.你应该阅读此 ...

最新文章

热门文章