How to get multiple render target pixel value by readRenderTargetPixels

I have such vertex shader

attribute int id;
attribute int group;

flat varying int vid;
flat varying int vgroup;
void main() {

vid = id;
vgroup = group;
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
}

fragment shader

layout(location = 0) out int out_id;
layout(location = 1) out int out_group;
flat varying int vid;
flat varying int vgroup;

void main() {

    out_id = vid;
    out_group = vgroup;
}

write id and group to buffer in this way

const position = geometry.attributes.position;
const array = new Int32Array(position.count);
array.fill(id);
const bufferAttribute = new THREE.BufferAttribute(array, 1, false);
bufferAttribute.gpuType = THREE.IntType;
geometry.setAttribute('id', bufferAttribute);

const groupArray = new Int32Array(position.count);
groupArray.fill(gpId);
const groupBufferAttribute = new THREE.BufferAttribute(groupArray, 1, false);
groupBufferAttribute.gpuType = THREE.IntType;
geometry.setAttribute('group', groupBufferAttribute);

I can get id in this way

let pickingTexture = new THREE.WebGLRenderTarget(1, 1, {
    type: THREE.IntType,
    format: THREE.RGBAIntegerFormat,
    internalFormat: 'RGBA32I',
    count: 2
});
const pixelBuffer = new Int32Array(4);
this.m_Renderer.readRenderTargetPixels(pickingTexture, 0, 0, 1, 1, pixelBuffer);

How could I get group by readRenderTargetPixels

1 Like