【webGL】
1.类型化数组
WebGL设计复杂的计算,需要提前知道数值的精度,而标准的javascript数值无法满足需要。WebGL引入了一个概念,叫类型化数组。
ArrayBuffer的类型,表示的只是内存中指定的字节数,但不会指定这些字节用于保存什么类型的数据,其就是为将来使用而分配一定数量的字节。
var buffer=new ArrayBuffer(20);
创建该对象后,能够通过该对象获得的信息只有包含的字节数,方法是访问byteLength属性。
var bytes=buffer.byteLength;
1.1 视图
var view=new DataView(buffer,9,10);
创建一个从字节9开始到字节18的新视图。
读写数组缓冲器的数据,要求我们必须记住要将数据保存到哪里,需要占用多少字节,工作量很多,类型化视图应运而生。
1.2 类型化视图
也称为类型化数组,它们除了元素必须是某种特定的数据类型外,与常规的数组无异。
var unit16s=new Uint16Array(buffer,9,10);
还可以不用创建ArrayBuffer对象
常用方式:把常规数组传入类型化视图的构造函数即可。
var int8s=new Int8Array([10,20,30,40]);
2.WebGL上下文
var gl=drawing.getContext("experimental-webgl");
取得WebGL上下文对象后,就可以开始3D绘图了。
2.1常量
2.2方法命名
2.3准备绘图
操作WebGL上下文之前,首先使用clearColor()方法来指定要使用的颜色。
2.4视口与坐标
2.5缓冲区
2.6错误
手工调用gl.getError()方法,这个方法返回一个表示错误类型的常量。
2.7着色器(使用GLSL语言)
顶点着色器和片段着色器
顶点着色器将3D顶点转换为需要渲染的2D顶点。
片段着色器用于准确计算要绘制的每个像素。
2.8编写着色器
2.9绘图
webgl只能绘制三种形状,点、线、三角。
gl.drawElements()和gl.drawArrays()
【webGL】的更多相关文章
- 【webGL】threejs入门 ---创建一个简单立方体
开发环境 Three.js是一个JavaScript库,所以,你可以使用平时开发JavaScript应用的环境开发Three.js应用.如果你没什么偏好的话,我会推荐Komodo IDE. 调试建议使 ...
- 【WebGL】《WebGL编程指南》读书笔记——第6章
一.前言 最近重感冒发烧,妈蛋好难受,请假了3天,驾校也没去,简直僵硬!今天继续WebGL的学习. 二.正文 A. GLSL支持两种数据值类型: 整数型(int)与浮点型( ...
- 【WebGL】《WebGL编程指南》读书笔记——第5章
一.前言 终于到了第五章了,貌似开始越来越复杂了. 二.正文 Example1:使用一个缓冲区去赋值多个顶点数据(包含坐标及点大小) function initVerte ...
- 【WebGL】《WebGL编程指南》读书笔记——第3章
一.前言 根据前面一章的内容,继续第三章的学习. 二.正文 一起绘制三个点,这里要使用到缓存了 var n = initVertexBuffers(gl); //返回绘制点的个数 n ) ...
- 【WebGL】《WebGL编程指南》读书笔记——第2章
一.前言 最近看了<WebGL编程指南>这本书,发现还是很有意思的,故每章阅读后做个笔记. 二.正文 Example1:在canvas中绘制矩形 <!DOCTYPE html> ...
- 【WebGL】3. 相机
相机的种类:WebGL中的相机有两种:正投影相机和透视相机 1. 正投影相机OrthographicCamera:类似于工程图纸中的视角,忽略远近距离,远近的物体比例不变,多用于科学研究,工程图纸的应 ...
- 【WebGL】2.基础概念
引入Three.js <!DOCTYPE html> <html> <head> <title></title> </head> ...
- 【WebGL】1.WebGL简介
OpenGL和WebGL基本概念 OPEN GL:一个跨编程语言.跨平台的编程接口规格的专业的图形程序接口.它用于三维图像(二维的亦可),是一个功能强大,调用方便的底层图形库. WebGL:一个3D ...
- 【WebGL】WebGL API 详解
基于 WebGL Specifications 最全面的API释疑. 类型以及对象定义 这部分内容主要定义一部分类型和数据结构. typedef unsigned long GLenum; typed ...
随机推荐
- Eclipse中导入外部jar包步骤
昨天,学习了Jar包的打包过程,现在打算记录一下,如何在Eclipse中导入外部Jar包. 第一步:在项目中鼠标右键>>New>>点击Folder. 第二步:在弹出窗口将Fol ...
- Quoit Design(hdu1007)最近点对问题。模版哦!
Quoit Design Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total ...
- a/b + c/d(hdu2503)最大公约数问题
a/b + c/d Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total ...
- ArrayList源码解读(jdk1.8)
概要 上一章,我们学习了Collection的架构.这一章开始,我们对Collection的具体实现类进行讲解:首先,讲解List,而List中ArrayList又最为常用.因此,本章我们讲解Arra ...
- onkeydown小练习
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 语义slam用于高精地图和高精定位的一些想法
最近一直在考虑语义slam在自动驾驶和辅助驾驶中的用法,研究了一下视觉为主的高精度地图+高精定位的模式,特别是mobileye的REM. 秉承先建图再定位的思路,在服务器端(云端)建图,在车端定位. ...
- Maven的下载与安装(Windows版本)
前言: 安装Maven 3,需要安装jdk1.7及以上版本 具体步骤如下: 1.进入官网:http://maven.apache.org/download.cgi,如下图红框部分 其中: apache ...
- 页面可见性判断:document.hidden与visibilitychange事件
我们需要在特定的时候判断页面的显示状态,例如:当视频加载到可播放状态时,根据用户是否停留在当前页面来决定是否开始自动播放.页面的展示的状态的判断就需要用到html5新增的一个api:document. ...
- Java IO流学习总结一:输入输出流
Java IO流学习总结一:输入输出流 转载请标明出处:http://blog.csdn.net/zhaoyanjun6/article/details/54292148 本文出自[赵彦军的博客] J ...
- LeetCode题解之Linked List Cycle
1.题目描述 2.问题分析 使用快慢指针方法,一个快指针,一个慢指针,如果到某个时候,快指针追上了慢指针,则说明有环存在. 3.代码 bool hasCycle(ListNode *head) { i ...