使用带有three.js的GLSL 3 ES

Question

有没有人成功使用带有three.js库的GLSL 3 ES着色器？据我所知,最新版本(r68)是不可能的,因为人们甚至无法设置指令(这是必需的,并且必须在着色器代码之前的任何其他内容之前):

#version 300 es 

因为由three.js添加到每个着色器的前缀.

有谁知道解决这个问题？是否足以更改three.js代码以将指令附加到threejs着色器前缀的开头？

Answer 1

Three.js使用WebGL,它可以在Web浏览器中使用,而不是GLES,它是移动设备OpenGL的变体.虽然WebGL本身与GLES2密切相关,但它仍然是另一回事.目前,只存在WebGL 1.0.也许未来的版本将与GLES3更相关,但目前,没有WebGL实现将支持ES 3着色器.

Answer 2

您可以使用 ShaderMaterial 的 glslVersion 属性。不要使用

#version 300 es

着色器代码中的指令。

const material = new three.ShaderMaterial({ uniforms: {}, 
vertexShader: vscode, 
fragmentShader: fscode, 
glslVersion: three.GLSL3, });