gl.enable(gl.BLEND); gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);怎么用

这段代码是用于开启 WebGL 中的混合功能，并设置混合函数。具体解释如下：

- `gl.enable(gl.BLEND)`：启用混合功能。WebGL 可以将新绘制的像素颜色与画布上已经存在的像素颜色进行混合，从而实现透明度效果。
- `gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA)`：设置混合函数。这行代码中，第一个参数 `gl.SRC_ALPHA` 表示使用源像素的 alpha 值（即透明度）作为混合因子，第二个参数 `gl.ONE_MINUS_SRC_ALPHA` 表示使用目标像素的 alpha 值的补数作为混合因子。这个混合函数可以实现一种常见的混合效果，即源像素的 alpha 值越大，混合结果中该像素的颜色就会占据更大的比例。

具体使用方法可以参考以下示例代码：

// 创建 WebGL 上下文
const canvas = document.getElementById('myCanvas');
const gl = canvas.getContext('webgl');

// 启用混合功能并设置混合函数
gl.enable(gl.BLEND);
gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);

// 绘制半透明矩形
gl.clearColor(0.0, 0.0, 0.0, 0.0); // 设置清空颜色为全透明
gl.clear(gl.COLOR_BUFFER_BIT); // 清空画布
gl.begin(gl.TRIANGLES); // 开始绘制三角形
gl.color4f(1.0, 0.0, 0.0, 0.5); // 设置颜色为半透明红色
gl.vertex3f(-1.0, -1.0, 0.0);
gl.color4f(0.0, 1.0, 0.0, 0.5); // 设置颜色为半透明绿色
gl.vertex3f(1.0, -1.0, 0.0);
gl.color4f(0.0, 0.0, 1.0, 0.5); // 设置颜色为半透明蓝色
gl.vertex3f(0.0, 1.0, 0.0);
gl.end(); // 结束绘制

这段代码会绘制一个半透明的三角形，其中三个顶点的颜色分别为半透明的红色、绿色和蓝色。由于开启了混合功能并设置了混合函数，所以这个三角形看起来是半透明的。