WebGL webgl 是针对 canvas 的 3D上下文,与其它Web技术不同,WebGL并非是W3C制定的标准,而是由 Khronos Group 制定的. 类型化数组 WebGL所涉及的复杂运算需要提前知道数值的精度,但是标准的 JS 无法支持这一诉求. 因此WebGL引入了类型化数组这一概念,类型化数组也是数组,与一般的数组没有什么区别,只不过这种数组中所有元素的值都被指定为某一特定类型. 类型化数组的核心在于 ArrayBuffer 这一数据类型,每个 ArrayBuffer 对象表…

WebGL上下文 在支持WebGL的浏览器中,WebGL的名字为 "experimental-webgl",这是由于 webgl 的规范仍未制定完成 制定完成后名字就会改为简单的 "webgl" 如果浏览器不支持,那么在获取webgl上下文的时候浏览器会返回 null 所以在使用前需要检测返回值 基本的获取 WebGL 代码如下: let drawing = document.getElementById("drawing"); // 检测浏览器…

类型化视图 类型化视图一般也被认为是一种类型化数组. 因为其元素必须是某种特定的数据类型,类型化视图都继承自 Dataview Int8Array: 表示8位二补整数(即二进制补数) Uint8Array: 8位无符号整数 Int16Array: 16位二补数 Uint16Array: 16位无符号整数 Float32Array: 32位IEEE浮点值 Float64Array: 64位IEEE浮点值 与上面同名的构造函数都支持三个参数: ArrayBuffer 字节偏移量 字节长度 返回一个类…

绘图 WebGL只能绘制三种形状: 点 线 三角 其它的形状都是由上面的三种形状合成之后绘制到三维空间中的 执行绘图操作 WebGL 提供了两种方法: gl.drawElements() gl.drawArrays() 这两个方法的第一个参数都是一个常量 常量的取值范围如下: gl.POINTS: 将每个顶点当成一个点来绘制 gl.LINES: 将数组当成一系列的顶点,在这些顶点间划线,每个顶点既是起点也是终点,因此数组中必须包含偶数个顶点才能完成绘制 gl.LINE_LOOP: 将数组当成一系…

错误 Javascript与WebGL之间的一个最大区别在于,WebGL的操作一般不会抛出错误 如果希望获取WebGL的错误信息,那么就需要手动调用  gl.getError() 方法 该方法会返回以下错误常量之一: gl.NO_ERROR: 上一次操作没有发生错误 gl.INVALID_ENUM: 应该给WebGL方法传入常量但是传错了参数 gl.INVALID_VALUE: 在需要无符号数的地方传入了负值 gl.INVALID_OPERATION: 在当前状态下不能完成操作 gl.OUT_O…

前一段时间由于事情比较多,所以笔记耽搁了一段时间,从这一篇开始我会尽快写完这个系列. 文章中有什么不足之处,还望各位大佬指出. JS中的数据类型 上一篇中我写了有关JS引入的Script标签相关的东西. 那么这一篇,我们可以正式进入JS的世界了,emmm 前面的东西应该比较基础,大佬们不喜勿喷. 首先学习一门语言,最开始不出意外的话应该是先了解这门语言由什么类型的数据组成,毕竟语言都是建立在这些数据类型的基础之上的. 在介绍数据类型之前,我先大概说一下 typeof 操作符,这是JS中判断一个变…

继续记笔记,JavaScript越来越有意思了. 继续... 第三章:JavaScript基础 ECMAScript语法在很大程度上借鉴了C和其它类似于C的语言,比如Java和Perl. 大小写敏感:变量.函数名.操作符都是大小写敏感的,比如“text”和“Text”不同. 标识符: 第一个字符必须是字母.下划线或者美元符号($); 之后的字符可以是字母.下划线.美元符号或者数字. 标识符中的字母可以是ASCII和Unicode字母比如À and Æ,但是不推荐这样使用. 按照惯例,ECMASc…

此系列文章,用于记录所学,如有错误欢迎指出. Javascript组成 1.核心(ECMAScript) 2.文档对象模型(DOM) 3.浏览器对象模型(BOM) 1.核心(ECMAScript) ECMAScript说白了是定义Javascript的标准,而这种标准与浏览器并无依赖关系. 我们现在前端所使用的Javascript只是遵循这一标准的,以浏览器为宿主平台的脚本语言. 遵循这一标准的脚本语言都可以称之为js. 而js的宿主平台除了我们最常用的浏览器平台之外,还有node,和Adobe…

事件 JS与HTML的交互是通过事件实现的 而事件指的就是:文档或浏览器窗口特定的交互瞬间 可以通过侦听器来预定事件,以便在事件发生时执行相应的代码 这种模式也是设计模式中的观察者模式 事件流 有了事件,也就有了事件流的概念 事件流故名思意:也就是事件的流向,所以事件流描述的是从页面中接收事件的顺序 虽然事件流描述的都是事件的流向,但是事件流在当时的两个最大的浏览器厂商的提出中却是两个差不多完全相反的事件流概念 一是IE的冒泡事件流,二是Netscape的捕获事件流 事件冒泡 即事件开始时由最具…

Canvas绘图 Canvas自HTML5引入后,由于其炫酷的效果成为HTML5新增功能中最受欢迎的部分 Canvas元素通过在页面中设定一个区域,然后就可以使用JS在其中绘制图形 <canvas>元素最早是由苹果公司推出,主要是在 Dashboard 插件中使用,后来该元素被HTML5引入,然后得到主流浏览器的广泛支持 canvas除了具备绘制 2D 上下文的能力之外,还通过 WEBGL 提供了绘制3D上下文的能力 虽然浏览器对该功能的支持日益完善,但是需要注意的是一些老版本的操作系统由于缺…