![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
WebGL笔记
朱桂彪
这个作者很懒,什么都没留下…
展开
-
webGL是什么 (笔记1)
WebGL是什么WebGL,是一项用来在网页上绘制和渲染复杂三维图形(3D图形),并允许用户与之进行交互的技术。WebGL:在浏览器上绘制3D图形 ,WebGL 内嵌 在 浏览器 中,不需要安装插件和库就可以直接在浏览器当中使用,最大优势。WebGL直接使用文本编辑器就可以去开发,不需要搭建开发环境。多平台运行 轻松跨平台,只要有浏览器就可以打开WebGL。基于OpenGL E...原创 2018-05-10 20:26:01 · 2203 阅读 · 0 评论 -
WebGL原理 (笔记2)
WebGL执行原理图形流水线文字描述确定图形的每一个顶点,比如说一个三角形,她需要三个顶点来确定他的大小位置等图元装配: 他的意思主要是通过上面的 顶点 来确定一个图形光栅化: 你已经有了形状,就是骨架但是他的内部是空的,我们可以想象一下 3个火柴棍,拼成一个三角形,但是他不是有面积的,中间是空的,通过光栅化把他中间进行填充,这样他就变成了 类似一个实体片元着色:这里我...原创 2018-05-11 10:28:13 · 1579 阅读 · 1 评论 -
webGL公用函数库的引用(笔记3)
<!doctype html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0,原创 2018-06-04 15:21:19 · 2138 阅读 · 2 评论 -
WebGL初始化着色器(笔记4)
初始化着色器函数initShaders()被定义在了cuon.util.js中使用:initShaders(gl, vshader, fshader);参数:gl &nbsp;指定渲染的上下文vshader &nbsp;指定顶点着色器程序代码(字符串)fshader &nbsp;指定片元着色器程序代码(字符串)返回值:true &nbsp;初始化着色器成功false &nbsp...原创 2018-10-24 12:59:31 · 601 阅读 · 0 评论 -
WebGL的坐标系统(笔记5)
由于WebGL处理的是三维图形,所以它使用的是三维坐标系统(笛卡尔坐标系),具有x轴、y轴、z轴。三维坐标系统很容易理解,因为我们的世界也是三维的:具有宽度、高度和长度。在坐标系统中,轴的方向非常重要。WebGL采用的是右手坐标系,因为可以用右手来表示。如图:默认情况下WebGL和canvas的对应关系。canvas的中心点就是WebGL的(0.0,0.0,0.0)canvas的x...原创 2018-10-24 13:21:59 · 785 阅读 · 0 评论