问悬挂式检测着色器-如何返回顶点的坐标？

EN

// ...
varying vec3 position;
// ...
void main(void) {
    // ...
    position = gl_Position.xyz / gl_Position.w;
}

// ...
varying highp vec3 position;
// ...
void main(void) {
    // ...
    gl_FragColor.xyz = 0.5 * (position + 1.0); // position'll be in (-1, 1) range, where as gl_FragColor's clamped to (0, 1)
    gl_FragColor.w = isOverhang ? 1.0 : 0.0;
}

// ...
const pixelBuffer = new Uint8Array(4 * w * h);
renderer.readRenderTargetPixels(renderTarget, 0, 0, w, h, pixelBuffer);
for (let y = 0, offset = 0; y < h; ++y) {
    for (let x = 0; x < w; ++x, offset += 4) {

         // does pixel correspond to overhang area?
         if (pixelBuffer[offset + 3] > 0) {
             const posX = 2 * pixelBuffer[offset] / 255 - 1;
             const posY = 2 * pixelBuffer[offset + 1] / 255 - 1;
             const posZ = 2 * pixelBuffer[offset + 2] / 255 - 1;
             // ...
         }
    }
}

// WebGL2 
varying uint count; 
uniform uint2 resolutionOfFBO;

// compute output pixel
uint x = count % resolutinOfFBO.x;
uint y = count / resolutionOfFBO.x;

// set gl_Position so we'll write to that output pixel
gl_Position = vec4((vec2(x, y) + .5) / resolutionOfFBO, 0, 1);

function main() {
  const gl = document.createElement("canvas").getContext("webgl2");
  
  const vs = `#version 300 es
    in float in_value;
    out float out_value;
    
    void main() {
       out_value = in_value * 2.;
    }
  `;
  const fs = `#version 300 es
    precision mediump float;
    layout (location = 0) out vec4 dummy;
    void main() {
      dummy = vec4(1);
    }
  `;
  const prog = createProgram(gl, [vs, fs], ["out_value"]);
  const inLoc = gl.getAttribLocation(prog, 'in_value');
  const outLoc = 0;  
  
  const numVaryings = gl.getProgramParameter(prog, gl.TRANSFORM_FEEDBACK_VARYINGS);

  const srcBuffer1 = createBuffer(gl, new Float32Array([1, 2, 3]));
  const srcVAO1 = createVAO(gl, srcBuffer1, inLoc);

  const dstBuffer = createBuffer(gl, Float32Array.BYTES_PER_ELEMENT * 3);
  const srcVAO2 = createVAO(gl, dstBuffer, inLoc);

  const tf = gl.createTransformFeedback();
  gl.bindTransformFeedback(gl.TRANSFORM_FEEDBACK, tf);
  gl.useProgram(prog);
  gl.bindBufferBase(gl.TRANSFORM_FEEDBACK_BUFFER, 0, dstBuffer);
  // this binds the default (id = 0) TRANSFORM_FEEBACK buffer
  gl.bindTransformFeedback(gl.TRANSFORM_FEEDBACK, null);
  // This line is onky because of a bug in Chrome
  gl.bindBufferBase(gl.TRANSFORM_FEEDBACK_BUFFER, 0, null);

  runFeedback(gl, prog, srcVAO1, tf);  
  checkGLError(gl);
  
  const result = new Float32Array(3);
  gl.bindBuffer(gl.ARRAY_BUFFER, dstBuffer);
  gl.getBufferSubData(gl.ARRAY_BUFFER, 0, result);
  log(result);
}
main();

function runFeedback(gl, prog, srcVAO, tf, dstBufferInfo) {
  gl.enable(gl.RASTERIZER_DISCARD);

  gl.useProgram(prog);
  gl.bindVertexArray(srcVAO);
  
  gl.bindTransformFeedback(gl.TRANSFORM_FEEDBACK, tf);
  gl.beginTransformFeedback(gl.TRIANGLES);
  gl.drawArrays(gl.TRIANGLES, 0, 3);
  gl.endTransformFeedback();
  
  gl.bindTransformFeedback(gl.TRANSFORM_FEEDBACK, null);

  gl.disable(gl.RASTERIZER_DISCARD);
}

function checkGLError(gl) {
  const err = gl.getError();
  if (err) {
    log("GL ERROR:", err);
  }
}

function createShader(gl, shaderSource, shaderType) {
  var shader = gl.createShader(shaderType);
  gl.shaderSource(shader, shaderSource);
  gl.compileShader(shader);
  var compiled = gl.getShaderParameter(shader, gl.COMPILE_STATUS);
  if (!compiled) {
    console.error(gl.getShaderInfoLog(shader));
    gl.deleteShader(shader);
    return null;
  }
  return shader;
}

function createProgram(gl, shaderSources, outputs) {
  const shaderTypes = [gl.VERTEX_SHADER, gl.FRAGMENT_SHADER];
  const program = gl.createProgram();
  shaderSources.forEach(function(shaderSrc, ndx) {
    gl.attachShader(program, createShader(gl, shaderSrc, shaderTypes[ndx]));
  });
  
  if (outputs) {
    gl.transformFeedbackVaryings(program, outputs, gl.SEPARATE_ATTRIBS);
  }
  gl.linkProgram(program);

  var linked = gl.getProgramParameter(program, gl.LINK_STATUS);
  if (!linked) {
    console.error(gl.getProgramInfoLog(program));
    gl.deleteProgram(program);
    return null;
  }
  return program;
}
 
function createBuffer(gl, dataOrSize) {
  const buf = gl.createBuffer();
  gl.bindBuffer(gl.ARRAY_BUFFER, buf);
  gl.bufferData(gl.ARRAY_BUFFER, dataOrSize, gl.STATIC_DRAW);
  return buf;
}

function createVAO(gl, buf, inLoc) {
  const vao = gl.createVertexArray();
  gl.bindVertexArray(vao);
  gl.bindBuffer(gl.ARRAY_BUFFER, buf);
  gl.enableVertexAttribArray(inLoc);
  gl.vertexAttribPointer(inLoc, 1, gl.FLOAT, false, 0, 0);
  gl.bindBuffer(gl.ARRAY_BUFFER, null);  // this is not needed
  gl.bindVertexArray(null);
  return vao;
}

function log(...args) {
  const elem = document.createElement("pre");
  elem.textContent = [...args].join(' ');
  document.body.appendChild(elem);
}

gl.enable(gl.RASTERIZER_DISCARD);

gl.bindTransformFeedback(gl.TRANSFORM_FEEDBACK, tf);
gl.beginTransformFeedback(gl.TRIANGLES);
gl.drawArrays(gl.TRIANGLES, 0, 3);
gl.endTransformFeedback();

position0, normal0, position1, normal1, position2, normal2