简介
glsl-face-normal 是一个用于生成三角形面法线的 JavaScript 库，它可以在 WebGL 和 Three.js 等前端框架中使用。该库提供了一套简单易用的 API，可以帮助开发人员快速计算三角形面的法线，并用于光照计算、阴影投射等场景。
安装
你可以通过 NPM 来安装 glsl-face-normal，使用以下命令：
--- ------- ----------------
使用方法
下面是一个简单的示例代码，演示如何使用 glsl-face-normal 计算三角形面法线：
----- -------------- - --------------------------- -- ---- ----- --------- - - -- -- -- -- -- -- -- -- -- - -- ----- ----- ------- - - -- -- -- - -- ----- ----- ----------- - ------------------------- -------- ------------------------ -- ------ -- --
上述代码中，我们首先定义了一个三角形的顶点坐标和索引，然后调用 glslFaceNormal 方法来计算三角形面的法线向量。最后，我们将结果打印到控制台上，输出了一个长度为 3 的数组表示法线向量。
API
glsl-face-normal 提供了以下 API：
glslFaceNormal(positions: Float32Array, indices: Uint16Array): Float32Array
计算三角形面的法线向量。该方法接受两个参数：
positions: 一个包含所有顶点坐标的数组，类型为Float32Array。indices: 一个包含所有三角形面索引的数组，类型为Uint16Array。
该方法返回一个长度为 3 * indices.length 的数组，其中每个连续的三个元素表示一个三角形面的法线向量。
glslFaceNormal.vertexShaderSource: string
用于计算三角形面法线的顶点着色器源代码。你可以将它用于自定义的着色器程序中，以便对顶点属性进行更加灵活的控制。默认情况下，该着色器会读取 position 属性来计算法线向量。
glslFaceNormal.fragmentShaderSource: string
用于计算三角形面法线的片元着色器源代码。你可以将它用于自定义的着色器程序中，以便对渲染结果进行更加灵活的控制。默认情况下，该着色器会输出颜色值为法线向量的 RGB 分量。
示例
下面是一个使用 glsl-face-normal 在 Three.js 中渲染带有光照效果的立方体的示例代码：
------ - -- ----- ---- -------
------ - ------------- - ---- ----------------------------------------------
------ -------------- ---- ------------------
----- ------------ - -
--------- ---- ---------
--------- ---- -------
------- ---- ----------------
------- ---- -----------------
------- ---- -------------
------- ---- --------
---- ------ -
------- - ---------------------- - --------
----------- - ---------------- - --------------- - -------------- -----
-
-
----- -------------- - -
------- ---- --------
---- ------ -
---------------- - --------
-------------- - ----
-
-
----- ----- - --- -------------
----- ------ - --- --------------------------- ----------------- - ------------------- ---- -----
----------------- - -
----- -------- - --- ---------------------
----------------------------------- -------------------
--------
----------------------------------------------------------- ----------
---------------------------------------------------------------------------------------