Developer Channel 中的 WebGL 更新 (Internet Explorer)

项目
03/04/2016

Internet Explorer Developer Channel 包括大量的 WebGL 改进。

注意这些更新仅在 Internet Explorer Developer Channel 中提供，后者为运行 Internet Explorer 11 的 Windows 8.1 和 Windows 7 SP1 客户提供下载。

WebGL 中的改进

Internet Explorer Developer Channel 中的 WebGL 呈现器已更新，提高了性能并支持更多的功能。以下是有所变化的内容。

三角扇

drawArrays 和 drawArraysInstancedANGLE API 现在支持三角扇。

三角扇是一种更节省空间的方法，用来描述其所有三角形都具有同一顶点的几何图形。若要使用 TRIANGLES 创建以下图像，请使用重复的顶点来描述相邻的三角形，方法是以 A、B、C、A、C、D、A、D、E、A、E 和 F 填充缓冲区。若要对 TRIANGLE_FAN 执行同样的操作，请发送顶点 A、B、C、D、E 和 F，然后 GPU 将构建三角扇。

将生成使用更少的顶点进行描述的扇形区域。缓冲区中的顶点是三角扇中所有三角形所具有的同一顶点。通过使用上一个三角形的最后一个顶点（ABC、ACD、ADE 等），每个附加点都描述了一个额外的三角形。

三角扇如何减少描述区域所需的顶点数的插图。

drawElements 和 drawArraysInstancedANGLE API 尚不支持三角扇。

实例化支持

较早版本的 Windows Internet Explorer 不支持在 GPU 中绘制几何图形时进行实例化。这意味着如果你想要创建一个包含 10000 个树的林，你需要创建一个用于表示这么多树的顶点数组，或创建单个树几何图形并调用绘制 10000 次。

Internet Explorer Developer Channel 支持实例化，因此现在你可以上载一个几何图形并调用一次绘制，以使 GPU 重新生成它。GPU 使用指定的属性处理重新生成的几何图形。通过使用这一个几何图形作为引导，你的 10000 个树可以拉伸、平展或更改颜色和底纹。若要根据实例数据更改它们，请使用 vertexAttribDivisor 函数创建具有这些属性的顶点缓冲区，并设置你想要的重复方式。

支持使用以下新 API 进行实例化。

interface ANGLE_instanced_arrays {
    const GLenum VERTEX_ATTRIB_ARRAY_DIVISOR_ANGLE = 0x88FE;
    void drawArraysInstancedANGLE(GLenum mode, GLint first, GLsizei count, GLsizei primcount);
    void drawElementsInstancedANGLE(GLenum mode, GLsizei count, GLenum type, GLintptr offset, GLsizei primcount);
    void vertexAttribDivisorANGLE(GLuint index, GLuint divisor); 
};

使用实例化和 ANGLE_instanced_arrays，你可以减少上传到 GPU 的顶点数。有关使用 ANGLE_instanced_arrays 的详细信息，请参阅使用 ANGLE_instanced_arrays 进行 WebGL 实例化和 Khrono 的 WebGL ANGLE_instanced_arrays 扩展规范。

支持对 LINE_STRIP、TRIANGLES、TRIANGLE_STRIP 和 TRIANGLE_FAN 模式进行实例化。不能实例化 POINTS 模式。Internet Explorer Developer Channel 不支持 LINE_LOOP。仅 drawArrays 和 drawArraysInstancedANGLE 方法支持 TRIANGLE_FAN。

实例化仅适用于包含类似对象的模型，如包含许多树的林、包含一千名士兵的方阵或一百万只写莎士比亚的猴子。如果你要创建大量不相似的对象，它不会起作用。

支持在支持 Microsoft Direct3D 10 的 GPU 上进行实例化。不支持在支持 Microsoft Direct3D 9 的 GPU 上进行实例化。

GLSL 一致性改进

GLSL 中现在支持以下功能：

continue 流控制语句。
Octal 和 hex 整数。

内置变量：

const mediump int gl_MaxVertexAttribs；

const mediump int gl_MaxVertexUniformVectors；

const mediump int gl_MaxVaryingVectors；

const mediump int gl_MaxVertexTextureImageUnits；

const mediump int gl_MaxCombinedTextureImageUnits；

const mediump int gl_MaxTextureImageUnits；

const mediump int gl_MaxFragmentUniformVectors；

const mediump int gl_MaxDrawBuffers；

struct gl_DepthRangeParameters {
    highp float near; // n
    highp float far; // f
    highp float diff; // f - n
};
uniform gl_DepthRangeParameters gl_DepthRange;

精度验证。
仅“被采用”部分的条件短路和一致三元运算符执行。

对 16 位纹理的支持

Internet Explorer Developer Channel 支持 ArrayBuffer 输入的 16 位纹理。可以采用三种不同的方法在纹理中填充数据：图像元素、画布元素以及数组缓冲区。对于 16 位纹理，Internet Explorer Developer Channel 仅支持数组缓冲区。

WebGL 中的改进

三角扇

实例化支持

GLSL 一致性改进

对 16 位纹理的支持

相关主题

其他资源