Eye Texture Raytracing demo

Questions
1

I want to replicate the effect from Eye texture raytracing demo (vill.ee) I have done everything exactly the same but when I run the program it says:

“THREE.WebGLProgram: shader error: 0 35715 false gl.getProgramInfoLog invalid shaders THREE.WebGLShader: gl.getShaderInfoLog() fragment
ERROR: 0:154: ’
’ : extension directive must occur before any non-preprocessor tokens in ESSL3”

I have no idea what this means, can anybody help? feel free to inspect element to look at my code here: Three js (neocities.org)

Screenshot 2021-06-08 at 12.02.18
Screenshot 2021-06-08 at 12.02.182560×1412 371 KB

1 Like
2

The original demo uses a three.js version of r65. Porting such old code is normally only possible by applying migration tasks.

For now I suggest you are using WebGL1Renderer and then manage WebGL extensions via the extensions property of ShaderMaterial. Just set the respective entries to true if you need certain extensions (like derivatives).

3

How do I use WebGL1Renderer?

so all I need to do is add

this.extensions = {
derivatives: true, // set to use derivatives
fragDepth: false, // set to use fragment depth values
drawBuffers: false, // set to use draw buffers
shaderTextureLOD: false // set to use shader texture LOD
};

to my code and it will work?

4

No, not quite. Go to Migration Guide · mrdoob/three.js Wiki · GitHub

scroll aaaaaall the way down to r65->r66, and work up from there. Then, if you have any issues - we might be able to help.

1 Like