I've been working on creating a texture using a Three.WebGLRenderTarget and then trying to access it in a fragment shader in the following stage. The concept is to execute the first stage once to generate a complex and costly SDF map, and then access it in subsequent stages as required. Currently, I can create the test texture if I display it directly on the screen, but when I send it to a texture and attempt to read it, I only get a black screen.
I believe it's a simple issue and would appreciate any assistance.
Here is the test code:
import * as Three from 'three'
// Code for creating WebGLRenderer, WebGLRenderTarget, camera, buffer, scenes, quad meshes, etc.
window.addEventListener('resize', onWindowResize, false)
function onWindowResize() {
// Code for resizing window and updating camera
}
function loop() {
// Requesting animation frame and rendering
}
function render(scene) {
// Rendering the scene with the camera
}
function main() {
// Rendering buffer scene and starting the loop
}
main()
And the shaders:
const vertShader = `
// Vertex shader code
`;
const bufferShader = `
// Fragment shader code to generate a color based on UV coordinates
`;
const screenShader = `
// Fragment shader code to sample buffer texture and display it
`;