Tengo dos sombreadores simples en p5js y me gustaría pasar la salida del primero como una entrada de textura en el segundo.
Pensé que piratear el ejemplo de la cámara funcionaría, pero no puedo encontrar cómo recuperar la textura del primer sombreador.
Mi implementación ingenua no funciona:
... shader2.setUniform('tex0', shader1); ... // get texture from previous shader uniform sampler2D tex0; // grab texcoords from vert shader varying vec2 vTexCoord; void main() { vec2 uv = vTexCoord; uv.y = 1.0 - uv.y; vec4 tex = texture2D(tex0, uv); gl_FragColor = vec4(tex.rgb, 1.0); }error :
Uncaught TypeError: o is undefined Texture http://127.0.0.1:5500/libraries/p5.min.js:3 getTexture http://127.0.0.1:5500/libraries/p5.min.js:3 setUniform http://127.0.0.1:5500/libraries/p5.min.js:3 draw http://127.0.0.1:5500/sketch.js:24 redraw http://127.0.0.1:5500/libraries/p5.min.js:3 _draw http://127.0.0.1:5500/libraries/p5.min.js:3 _draw http://127.0.0.1:5500/libraries/p5.min.js:3 _draw http://127.0.0.1:5500/libraries/p5.min.js:3 _draw http://127.0.0.1:5500/libraries/p5.min.js:3 _runIfPreloadsAreDone http://127.0.0.1:5500/libraries/p5.min.js:3 _decrementPreload http://127.0.0.1:5500/libraries/p5.min.js:3 t http://127.0.0.1:5500/libraries/p5.sound.min.js:2 promise callback* http://127.0.0.1:5500/libraries/p5.sound.min.js:2 _ http://127.0.0.1:5500/libraries/p5.min.js:3 _ http://127.0.0.1:5500/libraries/p5.min.js:3 [261]</< http://127.0.0.1:5500/libraries/p5.min.js:3 promise callback*[261]< http://127.0.0.1:5500/libraries/p5.min.js:3 u http://127.0.0.1:5500/libraries/p5.min.js:3 u http://127.0.0.1:5500/libraries/p5.min.js:3 [248]< http://127.0.0.1:5500/libraries/p5.min.js:3 u http://127.0.0.1:5500/libraries/p5.min.js:3 i http://127.0.0.1:5500/libraries/p5.min.js:3 <anonymous> http://127.0.0.1:5500/libraries/p5.min.js:3 <anonymous> http://127.0.0.1:5500/libraries/p5.min.js:3 <anonymous> http://127.0.0.1:5500/libraries/p5.min.js:3Ni siquiera estoy seguro de que lo que estoy tratando de hacer sea posible con p5
Te estás perdiendo un paso aquí: no puedes pasar el objeto shader directamente a otro shader. Debe crear un búfer de gráficos fuera de pantalla con createGraphics ( doc ), aplicarle el primer sombreador y luego pasar el búfer al segundo sombreador.
ex:
setup(){ // ... buffer = createGraphics(width, height, WEBGL); // ... } draw(){ // ... buffer.shader(shader1); buffer.rect(0,0,width, height); shader2.setUniform('tex0', buffer); }