JS - Undeclared định: 'var' trong kịch bản GLSL

Question

Tôi là một chút mới sang HTML và Javascript và trong html của tôi, tôi có đoạn mã sau:

 <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> 

Tuy nhiên, nó sẽ trả

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

Tôi không được phép khai báo/xác định các biến bên trong thẻ tập lệnh trong HTML?

Answer 1

Mã ở trên không phải là JavaScript là GLSL. Đó là ngôn ngữ được sử dụng để viết các chương trình chạy trên GPU của bạn. Nó không có từ khóa var. Thay vào đó để khai báo biến trong GLSL bạn cần phải đặt một kiểu trước mặt họ

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)); 

Tôi không chắc chắn những gì bạn đang cố gắng làm trên nhưng tất cả các phương trình của bạn sản xuất vec3.

Ngoài ra, GLSL 1,00 es rất nghiêm ngặt về các loại. Bạn không thể sử dụng vec3 với số nguyên. Bạn phải sử dụng số dấu phẩy động. 0.0 thay vì 0. Dòng cuối cùng không có hàm pow lấy một vec3 ở bên trái và một giá trị duy nhất ở bên phải để vec3(10) lấy số nguyên 10 và chuyển nó thành một số vec3. Nó giống như nói vec3(10, 10, 10).

Ngoài ra GLSL không có thư viện Math.. Nó được xây dựng trong các chức năng là toàn cầu.