Ошибки на Фонг затенения (по текстуре) реализации в моих шейдеры

Question

Я пытаюсь научиться WebGL, пытался implemement Фонг затенение после этого образца кода по ссылке http://voxelent.com/html/beginners-guide/chapter_3/ch3_Sphere_Phong.html

я получаю две ошибки на шейдерного компиляции, и, следовательно, не отображается луна, которая должна быть дисплей, как я слежу Lesson11 из GitHub, где они делают сферу из прямоугольников, ошибки я получил являются:

ERROR: 0:49: '*' : wrong operand types no operation '*' exists that takes a left-hand operand of type 'mediump 3-component vector of float' and a right operand of type 'mediump 4-component vector of float' (or there is no acceptable conversion) 

И мой полный код:

<script id="shader-fs" type="x-shader/x-fragment"> 
     precision mediump float; 
     varying vec2 vTextureCoord; 
     varying vec3 vLightWeighting; 
     uniform sampler2D uSampler; 
     uniform float uShininess;  //shininess 
     uniform vec3 uLightDirection; //light direction 

     uniform vec4 uLightAmbient;  //light ambient property 
     uniform vec4 uLightDiffuse;  //light diffuse property 
     uniform vec4 uLightSpecular;  //light specular property 

     uniform vec4 uMaterialAmbient; //object ambient property 
     uniform vec4 uMaterialDiffuse; //object diffuse property 
     uniform vec4 uMaterialSpecular; //object specular property 

     varying vec3 vNormal; 
     varying vec3 vEyeVec; 

     void main(void) 
     { 
      vec3 L = normalize(uLightDirection); 
     vec3 N = normalize(vNormal); 

     //Lambert's cosine law 
     float lambertTerm = dot(N,-L); 

     //Ambient Term 
     vec4 Ia = uLightAmbient * uMaterialAmbient; 

     //Diffuse Term 
     vec4 Id = vec4(0.0,0.0,0.0,1.0); 

     //Specular Term 
     vec4 Is = vec4(0.0,0.0,0.0,1.0); 

     if(lambertTerm > 0.0) //only if lambertTerm is positive 
     { 
       Id = uLightDiffuse * uMaterialDiffuse * lambertTerm; //add diffuse term 
       vec3 E = normalize(vEyeVec); 
       vec3 R = reflect(L, N); 
       float specular = pow(max(dot(R, E), 0.0), uShininess); 
       Is = uLightSpecular * uMaterialSpecular * specular; //add specular term 
     } 
     //Final color 
      vec4 finalColor =Ia + Id + Is; 
      finalColor.a = 1.0; 
      vec4 textureColor = texture2D(uSampler, vec2(vTextureCoord.s, vTextureCoord.t)); 
      gl_FragColor = vec4(textureColor.rgb * finalColor, textureColor.a); 
     } 
    </script> 

    <script id="shader-vs" type="x-shader/x-vertex"> 
     attribute vec3 aVertexPosition; 
     attribute vec3 aVertexNormal; 
     attribute vec2 aTextureCoord; 
     uniform mat4 uMVMatrix; 
     uniform mat4 uPMatrix; 
     uniform mat3 uNMatrix; 
     uniform vec3 uAmbientColor; 
     uniform vec3 uLightingDirection; 
     uniform vec3 uDirectionalColor; 
     uniform bool uUseLighting; 
     varying vec2 vTextureCoord; 
     varying vec3 vLightWeighting; 

     varying vec3 vNormal; 
     varying vec3 vEyeVec; 

     void main(void) 
     { 
     //Transformed vertex position 
     vec4 vertex= uMVMatrix * vec4(aVertexPosition, 1.0); 

     //Transformed normal position 
     vNormal = vec3(uNMatrix * vec4(aVertexNormal, 1.0)); 

     //Vector Eye 
     vEyeVec = -vec3(vertex.xyz); 
     gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); 
     vTextureCoord = aTextureCoord;  
     } 
    </script> 

EDIT2:

<script id="shader-fs" type="x-shader/x-fragment"> 
     precision mediump float; 
     varying vec2 vTextureCoord; 
     varying vec3 vLightWeighting; 
     uniform sampler2D uSampler; 
     uniform float uShininess;  //shininess 
     uniform vec3 uLightDirection; //light direction 

     uniform vec4 uLightAmbient;  //light ambient property 
     uniform vec4 uLightDiffuse;  //light diffuse property 
     uniform vec4 uLightSpecular;  //light specular property 

     uniform vec4 uMaterialAmbient; //object ambient property 
     uniform vec4 uMaterialDiffuse; //object diffuse property 
     uniform vec4 uMaterialSpecular; //object specular property 

     varying vec3 vNormal; 
     varying vec3 vEyeVec; 

     void main(void) 
     { 
     vec3 L = normalize(uLightDirection); 
     vec3 N = normalize(vNormal); 

     //Lambert's cosine law 
     float lambertTerm = dot(N,-L); 

     //Ambient Term 
     vec4 Ia = uLightAmbient * uMaterialAmbient; 

     //Diffuse Term 
     vec4 Id = vec4(0.0,0.0,0.0,1.0); 

     //Specular Term 
     vec4 Is = vec4(0.0,0.0,0.0,1.0); 

     if(lambertTerm > 0.0) //only if lambertTerm is positive 
     { 
     Id = uLightDiffuse * uMaterialDiffuse * lambertTerm; //add diffuse term 
     vec3 E = normalize(vEyeVec); 
     vec3 R = reflect(L, N); 
     float specular = pow(max(dot(R, E), 0.0), uShininess); 
     Is = uLightSpecular * uMaterialSpecular * specular; //add specular term 
     } 
     //Final color 
     vec4 finalColor =Ia + Id + Is; 
     finalColor.a = 1.0; 
     vec4 textureColor = texture2D(uSampler, vec2(vTextureCoord.s, vTextureCoord.t)); 
     gl_FragColor = vec4(textureColor.rgb, textureColor.a)+finalColor; 
     } 
    </script> 

    <script id="shader-vs" type="x-shader/x-vertex"> 
     attribute vec3 aVertexPosition; 
     attribute vec3 aVertexNormal; 
     attribute vec2 aTextureCoord; 
     uniform mat4 uMVMatrix; 
     uniform mat4 uPMatrix; 
     uniform mat3 uNMatrix; 
     uniform vec3 uAmbientColor; 
     uniform vec3 uLightingDirection; 
     uniform vec3 uDirectionalColor; 
     uniform bool uUseLighting; 
     varying vec2 vTextureCoord; 
     varying vec3 vLightWeighting; 

     varying vec3 vNormal; 
     varying vec3 vEyeVec; 

     void main(void) 
     { 
     //Transformed vertex position 
     vec4 vertex= uMVMatrix * vec4(aVertexPosition, 1.0); 

     //Transformed normal position 
     vNormal = vec3(uNMatrix * vec3(aVertexNormal)); 

     //Vector Eye 
     vEyeVec = -vec3(vertex.xyz); 
     gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); 
     vTextureCoord = aTextureCoord; 
     } 
    </script> 

Как отобразить луну с Фонг эффектов затенения. Может кто-нибудь, пожалуйста, помогите мне?

Answer 1

Сообщение об ошибке однозначно: вы пытаетесь умножить vec3 на vec4, который obvoiusly не имеет смысла вообще. Он также говорит, что ошибка в строке 49 шейдера:

gl_FragColor = vec4(textureColor.rgb * finalColor, textureColor.a); 
//         ^finalColor is a vec4! 

вероятно Вы имели в виду, чтобы tuse finalColor.rgb здесь.