WebGL点光源问题

我曾尝试在WebGL中创建一个旋转立方体，并使用纹理映射技术对其进行纹理处理，我认为效果很好。立方体旋转是为了尝试和演示我尝试实现的（点）照明，但它似乎以一种意外的方式运行，我不确定是什么导致了它。任何提示都将不胜感激，谢谢

//顶点着色器程序
var VSHADER_源=`
属性向量4 a_位置；
属性向量4 a_颜色；
属性向量4 a_Normal；
属性向量2 VertexCoord；
一致mat4u_模型矩阵；
一致mat4u_正规矩阵；
均匀mat4 u溳ProjMatrix；
可变的vec4 v_颜色；
可变vec3 v_正常；
可变vec2框架；
可变vec3 v_位置；
void main（）{
gl_Position=u_ProjMatrix*u_ModelMatrix*a_Position；
v_Normal=规格化（vec3（u_NormalMatrix*a_Normal））；
v_颜色=a_颜色；
fragTexCoord=vertTexCoord；
}
`;
//片段着色器程序
变量FSHADER_源=`
精密中泵浮子；
均匀取样器；
可变vec3 v_正常；
可变vec3 v_位置；
可变vec2框架；
可变的vec4 v_颜色；
均匀的vec3 u_亮色；
均匀vec3u_光位；
均匀vec3 u_环境光；
void main（）{
vec3正常=正常化（v_正常）；
vec3 u_LightDirection=规格化（u_LightPosition-v_位置）；
float nDotL=最大值（点（u_光方向，法线），0.0）；
vec4 TexColor=纹理2d（采样器，fragTexCoord）；
vec3弥漫性；
漫反射=u_LightColor*TexColor.rgb*nDotL*1.2；
vec3 ambient=u_AmbientLight*v_Color.rgb；
gl_FragColor=vec4（漫反射+环境光，v_颜色.a）；
}
`;
var modelMatrix=new Matrix4（）；//模型矩阵
var projMatrix=new Matrix4（）；//投影矩阵
var g_normalMatrix=new Matrix4（）；//法线坐标变换矩阵
var g_xAngle=0.0；//旋转x角度（度）
函数main（）{
//检索元素
var canvas=document.getElementById（'webgl'）；
canvas.width=document.body.clientWidth；
canvas.height=document.body.clientHeight；
//获取WebGL的渲染上下文
gl=getWebGLContext（画布）；
如果（！gl）{
log（'未能获取WebGL的呈现上下文'）；
返回；
}
//初始化着色器
if（！initShaders（gl、VSHADER_源、FSHADER_源））{
log（'初始化着色器失败'）；
返回；
}
//设置“清除颜色”并启用隐藏曲面删除
gl.clearColor（1,1,1,1.0）；
总帐启用（总帐深度测试）；
//清晰的颜色和深度缓冲区
gl.clear（gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT）；
//获取统一属性的存储位置
u_ModelMatrix=gl.getUniformLocation（gl.program，“u_ModelMatrix”）；
u_NormalMatrix=gl.getUniformLocation（gl.program，“u_NormalMatrix”）；
u_ProjMatrix=gl.getUniformLocation（gl.program，'u_ProjMatrix'）；
u_LightColor=gl.getUniformLocation（gl.program，'u_LightColor'）；
u_LightPosition=gl.getUniformLocation（gl.program，“u_LightPosition”）；
u_AmbientLight=gl.getUniformLocation（gl.program，“u_AmbientLight”）；
如果（！u_ModelMatrix | | |！u_ProjMatrix | |！u_NormalMatrix | |！u_LightColor | |！u_LightPosition　|| !环境光{
console.log（'获取存储位置失败'）；
返回；
}
//设置灯光颜色（白色）
gl.uniform3f（u_LightColor，1.0,1.0,1.0）；
//设置灯光方向（在世界坐标中）
gl.uniform3f（u_光位置，1,1,1）；
//设置环境光
gl.uniform3f（u_环境光，0.2,0.2,0.2）；
projMatrix.setPerspective（30，canvas.width/canvas.height，1100）；
函数渲染（现在）{
现在*=0.001；//转换为秒
g_xAngle=（g_xAngle+1）%360
draw（）；
请求动画帧（渲染）；
}
请求动画帧（渲染）；
}
函数initVertexBuffers（gl）{
var顶点=新Float32Array（[//坐标
-0.5,0.5，-0.5，//顶部
-0.5, 0.5, 0.5,  
0.5, 0.5, 0.5,  
0.5, 0.5, -0.5,
-0.5,0.5,0.5，//对
-0.5,-0.5, 0.5,  
-0.5,-0.5,-0.5,  
-0.5, 0.5, -0.5,
0.5,0.5,0.5，//左
0.5,-0.5, 0.5,   
0.5,-0.5,-0.5,   
0.5, 0.5,-0.5,
0.5,0.5,0.5，//前面
0.5, -0.5, 0.5,  
-0.5,-0.5, 0.5,   
-0.5, 0.5, 0.5,
0.5,0.5，-0.5，//返回
0.5,-0.5,-0.5,  
-0.5, -0.5,-0.5,   
-0.5, 0.5,-0.5,
-0.5，-0.5，-0.5，//底部
-0.5,-0.5, 0.5,   
0.5,-0.5, 0.5,  
0.5,-0.5, -0.5,
]);
var texcoords=new Float32Array([
//u、 v:u交叉，v向下。0,0左上角，0,1左下角等。
//蓝色的
0.0,  0.0,
1/3,  0.0,
1/3,  1/3,
0,  1/3,
//绿色的
0.0,  1/3,
1/3,  1/3,
1/3,  2/3,
0.0,  2/3,
//橙色的
1/3,  1/3,
2/3,  1/3,
2/3,  2/3,
1/3,  2/3,
//红色的
0.0,  2/3,
1/3,  2/3,
1/3,  1.0,
0.0,  1.0,
//白色的
1/3,  2/3,
2/3,  2/3,
2/3,  1.0,
1/3,  1.0,
//黄色的
2/3,  2/3,
1.0,  2/3,
1.0,  1.0,
2/3,  1.0,
])
var normals=new Float32Array（[//Normal
0.0,0.0,1.0,0.0,0.0,1.0,0.0,0.0,1.0,0.0,0.0,1.0，//v0-v1-v2-v3前部
1.0,0.0,0.0,1.0,0.0,0.0,1.0,0.0,0.0,1.0,0.0,0.0，//v0-v3-v4-v5右
0.0,1.0,0.0,0.0,1.0,0.0,0.0,1.0,0.0,0.0,1.0,0.0，//v0-v5-v6-v1以上
-1.0,0.0,0.0，-1.0,0.0,0.0，-1.0,0.0,0.0，-1.0,0.0,0.0，//v1-v6-v7-v2左
0.0，-1.0,0.0,0.0，-1.0,0.0,0.0，-1.0,0.0,0.0，-1.0,0.0，//v7-v4-v3-v2向下
0.0,0.0，-1.0,0.0,0.0，-1.0,0.0,0.0，-1.0,0.0,0.0，-1.0//v4-v7-v6-v5背面
]);
var指数=新的Uint8Array([
0,1,2,0,2,3，//前面
4,5,6,4,6,7，//对
8,9,10,8,10,11，//向上
12,13,14,12,14,15，//左
16,17,18,16,18,19，//向下
20,21,22,20,22,23//返回
]);
//将顶点属性写入缓冲区（坐标、颜色和法线）
如果（！initArrayBuffer（gl，'a_位置'，顶点，3，gl。
v_Normal = normalize(vec3(u_NormalMatrix * a_Normal));

v_Normal = normalize(vec3(u_NormalMatrix * vec4(a_Normal,0)));

v_Normal = normalize(mat3(u_NormalMatrix) * a_Normal.xyz);

gl_Position = u_ProjMatrix * u_ModelMatrix * (a_Position + vec4(a_Normal.xyz * 0.1, 0));

gl_FragColor = TexColor + 0. * vec4(diffuse + ambient, v_Color.a);

gl_FragColor = normal * 0.5 + 0.5 + 0. * ....

modelMatrix.rotate(g_xAngle, /* 1 */ 0, 1, 0);