Trying to create some shaders within editor but without success. Want to achieve something like this https://victhorlopez.github.io/editor/ (choose - load and water example) but implemented codes for vertex and fragment under object - material tab/program - vertex/fragment and SHADERMATERIAL type, not working (Showing blank screen). I cant figure out how to add custom shader like that for basic plane. Its even possible to use/recreate shaders from sites like https://shaderfrog.com/ directly in editor?
There is a predefined example that you can use as a template:
Yes i used it as template. I described how I used material tab and paste codes into vertex/fragment in 3.js editor but without results.
Can you please post the code you’ve pasted into the info, vertex and fragment tab?
For testing purposes I used same code from the first link with water example (under code tab there is code for vertex and fragment) but dont know what to put into INFO tab to make it working.
The problem is that the water example uses normal maps. It’s not possible to add textures to custom shaders in the editor so far, see:
1 Like
Thank you for quick reply. Yes, you are right, adding texture to shader is the problem. Is there any other way to recreate simple GLSL water flow/wave throught color only Perlin noise shader? Or import it as a Json from Blender into editor?
Sry, i don’t know that. The normal maps in the examples are used to create the moving ripples of the water. I’m not sure if you can replace them with just noise. It might work but eventually only with a shader that is computationally more expensive.
Maybe you can try to rebuild to scene in three.js, export it via scene.toJSON(), create a JSON file of this stuff and then import it into the editor. The images are embedded in the file via data URIs.