此代码如何处理绑定到同一目标的多个缓冲区？

Question

我有这个 webgl 代码

const positionBuffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);
gl.bufferData(gl.ARRAY_BUFFER, positionData, gl.STATIC_DRAW);

const pointSizeBuffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, pointSizeBuffer);
gl.bufferData(gl.ARRAY_BUFFER, pointSizeData, gl.STATIC_DRAW);



gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);
gl.vertexAttribPointer(aPositionLoc, 2, gl.FLOAT, false, 0, 0);

gl.bindBuffer(gl.ARRAY_BUFFER, pointSizeBuffer);
gl.vertexAttribPointer(aPointSizeLoc, 1, gl.FLOAT, false, 0, 0);

其他事情已就位，并且此代码工作正常，因此我不会粘贴整个代码以保持代码简短。

我是 WebGL 新手，我正在尝试形成事物的心理模型。

所以我当前的思考过程是只有一个缓冲区绑定到目标（在本例中为

ARRAY_BUFFER

），当发生绘制调用时，将从该缓冲区读取数据。

但是我如何解释这段代码是这样的

1. 当我绑定

   pointSizeBuffer

   时，

   positionBuffer

   不应该被绑定
2. 如果

   positionBuffer

   不再绑定并且代码仍在工作，这意味着

   vertextAttribPointer

   能够将值绑定到属性，即使缓冲区不再绑定，这些值仍然存在。

这是正确的想法吗？

我尝试谷歌搜索了一下，发现一次只能绑定一个缓冲区，所以这段代码的行为让我感到惊讶，我原以为着色器不会获取

position

数据，而只会获取

pointSize

数据，因为是最后一跳。

我是一个Webgl菜鸟，所以不太清楚理解缓冲区、目标等这些术语，但我正在尝试一步一步地进行。

PS 我知道我们可以在一个缓冲区中交错值，并且我做到了这一点所以不建议这样做。我只是想了解事情是如何运作的

Answer 1

顶点缓冲区绑定 (

ARRAY_BUFFER

) 是全局状态。但是，数组缓冲区与特定顶点数组规范的绑定存储在“顶点数组对象”的状态向量中。 VAO 状态向量中声明的每个属性可以引用不同的数组缓冲区。当 vertexAttribPointer

 被调用时，当前绑定到目标 

ARRAY_BUFFER 的缓冲区将与指定的属性索引关联，并且对象的 ID 存储在当前绑定的 VAO 的状态向量中。