JS - 未声明的标识符：GLSL 脚本中的 'var'

Question

我对 HTML 和 Javascript 有点陌生，在我的 html 中，我有以下代码：

        <script id="fragmentShader" type="x-shader/x-fragment">
                precision mediump float;

                //varying vec3 fragmentColor;  //not needed?
                varying vec3 fragmentNormal;
                varying vec3 fragmentLight;
                varying vec3 fragmentView;

                uniform vec3 modelColor;
                uniform vec3 lightColor;

                void main() {
                        var m = normalize(fragmentNormal);
                        var l = normalize(fragmentLight);
                        var v = normalize(fragmentView);
                        var h = normalize(l + v);

                        var d = Math.max(l * m , 0);
                        var s = Math.pow(Math.max(h * m, 0), 10);

                        fragmentColor = modelColor * lightColor * d + lightColor * s;

                        gl_FragColor = vec4(fragmentColor, 1.0);
                }
        </script>

然而，returns

Failed to compile shader: ERROR: 0:13: 'var' : undeclared identifier 
ERROR: 0:13: 'm' : syntax error

我是否不允许在 HTML 中的脚本标签内 declare/define 变量？

Answer 1

上面的代码不是 JavaScript，而是 GLSL。它是用于在您的 GPU 上编写运行程序的语言。它没有关键字 var。而不是在 GLSL 中声明变量，您需要在它们前面放置一个类型

vec3 m = normalize(fragmentNormal);

vec3 l = normalize(fragmentLight);
vec3 v = normalize(fragmentView);
vec3 h = normalize(l + v);

vec3 d = max(l * m , 0.0);
vec3 s = pow(max(h * m, 0.0), vec3(10));

我不确定你在上面试图做什么，但你所有的方程式都产生 vec3。

此外，GLSL 1.00 es 对类型也很严格。您不能将 vec3 与整数一起使用。您必须使用浮点数。 0.0 而不是 0。最后一行没有函数 pow 在左边接受一个 vec3 而在右边接受一个值所以 vec3(10) 接受整数 10 并将其转换为 vec3 .这与说 vec3(10, 10, 10).

相同

此外，GLSL 没有 Math. 库。它内置的函数是全局的。

JS - 未声明的标识符：GLSL 脚本中的 'var'

JS - Undeclared identifier: 'var' in GLSL script

html

javascript

glsl

webgl