为什么在更改positionViewcolorView时缓冲区也发生变化?

var buffer = new ArrayBuffer(nbrOfVertices * vertexSizeInBytes);
var positionView = new Float32Array(buffer);
var colorView = new Uint8Array(buffer);

最佳答案

所有typed array structures都是ArrayBuffer上的视图。它们允许您以选定的布局(例如32位浮点数)访问和修改ArrayBuffer中的基础二进制数据。

如果要创建单独的缓冲区,则可以通过使用顶点数乘以组件数作为参数来创建位置缓冲区和颜色缓冲区,这将隐式创建可通过视图的buffer属性访问的基础ArrayBuffer

var numVertices = 4;
var positions = new Float32Array(numVertices * 3 /*position: x, y, z*/);
var colors = new Uint8Array(numVertices * 4 /*color: r, g, b, a*/);


如果您尝试使用以下布局设置隔行扫描的VertexBuffer:f32pX,f32pY,f32pZ,ui8cR,ui8cG,ui8cB,ui8cA“即时”
您的colorView还会“查看”浮动数据,因此您必须将文字偏移12个字节。

var positionOffset = 3 * 4;//3 positions with 4 byte each
var bufferOffset = positionOffset+4;//each color component is 1 byte
for (
  var colorStart = positionOffset;
  colorStart < colorView.length;
  colorStart += bufferOffset
) {
  colorView[colorStart]=r;
  colorView[colorStart+1]=g;
  colorView[colorStart+2]=b;
  colorView[colorStart+3]=a;
}

关于javascript - 为什么ArrayBuffer更改值?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/29730599/

10-11 21:25