什么是 glutils
glutils 是一个 npm 包，用于处理 WebGL 相关的操作。它提供了一些常见的操作方法，使得开发者能够更加方便地开发 WebGL 应用程序。
使用方法
安装 glutils
npm install glutils
导入 glutils
// ES6 import * as GLUtils from 'glutils'; // CommonJS const GLUtils = require('glutils');调用 glutils 提供的方法
比如，如果你需要创建一个 WebGL 上下文并拥有一个简单的着色器程序，可以使用以下代码：
-- -------------------- ---- ------- ----- ------ - --------------------------------- ---------------------------------- ----- -- - --------------------------- ----------------------- - --------- ---- ---------- ---- ------ - ----------- - ---------- - -- - ---- ------ - ------------ - --------- ---- ---- ----- - ---上述代码创建了一个 300x150 的 canvas 元素，并在 body 元素中添加了该元素。接着，它获取了 WebGL 上下文，并使用 glutils 的
initShaders方法初始化着色器程序。initShaders方法包含两个参数：第一个参数是 WebGL 上下文，第二个参数是一个包含着色器程序源码的字符串。在上述代码中，第一个参数是gl，第二个参数分别为顶点着色器程序和片元着色器程序的源码。在调用
initShaders方法后，你将拥有一个着色器程序对象。你可以使用 glutils 提供的其他方法来设置该着色器程序的 uniform 变量以及顶点属性。
示例代码
下面是一个完整的示例代码，它演示了如何使用 glutils 创建一个 WebGL 应用程序：
-- -------------------- ---- -------
------ - -- ------- ---- ----------
----- ------ - ---------------------------------
----------------------------------
----- -- - ---------------------------
----------------------- -
--------- ---- ----------
------- ---- -------------
---- ------ -
----------- - ------------ - ----------
-
-- -
--------- ------- ------
------- ---- -------
---- ------ -
------------ - -------
-
---
----- ------------ - ------------------------------ --- --------------
----- ---- ----
----- ----- ----
---- ----- ----
---- ---- ----
----
----- ----------- - ----------------------------- --- -------------
-- -- --
-- -- --
----
----- ----------- - ----------------------------
----------------------------------------- ----- ---- -----
----- -------- - ------------------------------------- -------------
-------------------------------------
-------------------------------- -- --------- ------ -- ---
----- ----- - -------------------------------------- ----------
-------------------- ----- ---- ---- ------
----- ------------------ - -------------------------------------- ----------------
--------------------------------------- ------ -------------
----------------------------- -- ------------------ ---上述代码创建了一个正方形，并使用了一个矩阵变换将其沿着 x 轴平移了 0.75 个单位长度。注意，上述代码中使用了 glutils 提供的许多方法，例如 createVertexBuffer，createIndexBuffer，createModelMatrix，translateModelMatrix 等等。
这段代码运行后应该会在页面上显示出一个红色的正方形。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066e71255dee6beeee749a