增加ray结果法线计算。

修复diffuse着色器报错。
修复延迟渲染下点光源位置报错。
修复无index几何体射线检测错误。

src/CGE.ts

@@ -66,6 +66,7 @@ export { FirstPersonControl } from './extensions/FirstPersonControl';
 
 export { Loader } from './io/Loader';
 
+export { calcTangent } from './util/Util'
 export { Raycaster } from './util/RayCaster';
 export { triangleIntersect } from './util/TriangleIntersect';
 

src/math/Triangle.ts

@@ -26,4 +26,30 @@ export class Triangle {
     public intersectTriangle(triangle: Triangle) {
         return triangleIntersect(this, triangle);
     }
-}
+}
+
+Triangle.prototype.computeNormal = function() {
+
+    const tempVec = new Vector3();
+
+    return function(target?: Vector3) {
+        if (!target) {
+            target = new Vector3();
+        }
+
+        target.subBy(this.p3, this.p2);
+        tempVec.subBy(this.p1, this.p2);
+        target.crossAt(tempVec);
+
+        const targetLenSqr = target.lengthSquare();
+
+        if (targetLenSqr > 0) {
+            target.mul(1.0 / Math.sqrt(targetLenSqr));
+        } else {
+            target.set(0, 0, 0);
+        }
+
+        return target;
+    }
+
+}()

src/object/Mesh.ts

@@ -81,10 +81,10 @@ Mesh.prototype.raycast = function() {
     const invMat: Matrix4 = new Matrix4();
     const ray: Ray = new Ray();
 
-    // const triangle: Triangle = new Triangle();
-    const p1: Vector3 = new Vector3();
-    const p2: Vector3 = new Vector3();
-    const p3: Vector3 = new Vector3();
+    const triangle: Triangle = new Triangle();
+    const p1: Vector3 = triangle.p1;
+    const p2: Vector3 = triangle.p2;
+    const p3: Vector3 = triangle.p3;
     const target: Vector3 = new Vector3();
     const normal: Vector3 = new Vector3();
 
@@ -162,7 +162,7 @@ Mesh.prototype.raycast = function() {
                     p3.set(posData[idx2], posData[idx2 + 1], thrNum ? posData[idx2 + 2] : 0); 
 
                     if(ray.intersectTriangle(p1, p2, p3, backCulling, target)) {
-                        // triangle.computeNormal(normal);
+                        triangle.computeNormal(normal);
                         target.applyMatrix4(this._matrix);
                         let distance = target.distanceTo(raycaster.ray.origin);
                         if (distance < raycaster.near || distance > raycaster.far) {
@@ -177,7 +177,7 @@ Mesh.prototype.raycast = function() {
                     }
                 }
             } else {
-                for (let i = 0, l = posData.length / num; i < l; i += 3 * num) {
+                for (let i = 0, l = posData.length; i < l; i += 3 * num) {
 
                     let idx = i + offset;
                     p1.set(posData[idx], posData[idx + 1], posData[idx + 2]);
@@ -187,8 +187,8 @@ Mesh.prototype.raycast = function() {
                     p3.set(posData[idx], posData[idx + 1], posData[idx + 2]);
 
                     if(ray.intersectTriangle(p1, p2, p3, backCulling, target)) {
-                        // triangle.computeNormal(normal);
-                        target.applyMatrix4(this._matrix)
+                        triangle.computeNormal(normal);
+                        target.applyMatrix4(this._matrix);
                         let distance = target.distanceTo(raycaster.ray.origin);
                         if (distance < raycaster.near || distance > raycaster.far) {
                             continue

src/renderer/WebGLSupports.ts

@@ -59,13 +59,17 @@ export class WebGLSupports {
         this._instanceArrays = gl.getExtension('ANGLE_instanced_arrays');
         this._elementIdxUint = gl.getExtension("OES_element_index_uint");
 
-        // this.drawArraysInstanced = this._instanceArrays.drawArraysInstancedANGLE.bind(this._instanceArrays);
+        if (this._instanceArrays) {
+            this.drawArraysInstanced = this._instanceArrays.drawArraysInstancedANGLE.bind(this._instanceArrays);
+        }
     }
 
-    public drawBuffers(buffers: number[]) {};
+    public drawBuffers(buffers: number[]) {
+        this._drawBuffers
+    };
 
     public drawArraysInstanced(mode: number, first: number, count: number, primcount: number) {
-        // this._instanceArrays.drawArraysInstancedANGLE
+
     }
 
     public setWebGL2(v: boolean) {

src/renderer/pipeline/DeferredPipeline.ts

@@ -147,6 +147,7 @@ export class DeferredPipeline {
             mat.setLightPos(pl.getPosition());  
             mesh.setScale(r, r, r);
             mesh.setPositionAt(pl.getPosition());
+            mesh.update(0, true)
             glProgram.lightColor.copy(pl.color);
             renderer.directRenderMesh(mesh);
         }

src/renderer/shaders/libs/diffuse_vert_glsl.ts

@@ -6,6 +6,6 @@ uniform mat4 u_mvpMat;
 void main()
 {
     v_uv = vec2(a_texcoord.x, 1.0 - a_texcoord.y);
-    gl_Position = u_mvp * a_position;
+    gl_Position = u_mvpMat * a_position;
 }
 `;

src/util/Util.ts

@@ -62,7 +62,7 @@ export function Check2DPointInPoly(pt: IPoint2D, poly: IPoint2D[]): boolean {
  * @param indexData 元素索引数组
  * @returns 切线数组
  */
-export function calcTangent(posData: number[], uvData: number[], normalData: number[], indexData: number[]): number[] {
+export function calcTangent(posData: number[] | ArrayLike<any>, uvData: number[] | ArrayLike<any>, normalData: number[] | ArrayLike<any>, indexData: number[] | ArrayLike<any>): number[] {
     let numVertices: number = posData.length / 3;
     let numIndices: number = indexData.length;
 

test.ts

@@ -482,6 +482,7 @@ teapotMesh.name = '水壶2';
 mainScene.addChild(teapotMesh);
 
 
+const baseColorMat = new CGE.ColorMaterial(new CGE.Vector4(0.5, 1.0, 0.5, 1.0));
 standMat = new CGE.StandardMaterial(diffTex, normTex, specTex, specTex, specTex);
 standMat.setIrradianceMap(cubeTexture);
 standMat.setPrefilterMap(cubeTexture);
@@ -494,7 +495,7 @@ teapotMesh = new CGE.Mesh();
 teapotMesh.setScale(2, 2, 2);
 teapotMesh.setPosition(100, 100, 0);
 teapotMesh.setGeometry(teapotGeometry);
-teapotMesh.setMaterial(standMat);
+teapotMesh.setMaterial(baseColorMat);
 teapotMesh.name = '水壶3';
 mainScene.addChild(teapotMesh);
 
@@ -507,6 +508,9 @@ let tri_num = 20;
 let half_num = tri_num / 2;
 
 let vertexd = new Float32Array(tri_num * tri_num * tri_num * 18);
+let normald = [];
+
+let tri1 = new CGE.Triangle();
 
 for (let k = 0; k < tri_num; k++) {
     for (let j = 0; j < tri_num; j++) {
@@ -521,7 +525,7 @@ for (let k = 0; k < tri_num; k++) {
     }
 }
 
-let tri1 = new CGE.Triangle();
+tri1 = new CGE.Triangle();
 let tri2 = new CGE.Triangle();
 
 window['tri1'] = tri1;
@@ -543,17 +547,31 @@ let startTime = Date.now();
 
 let le = tri_num * tri_num * tri_num;
 
+let normalVec = new CGE.Vector3()
+
 for (let i = 0; i < le; i++) {
     let index = i * 18;
 
     t1p1.set(vertexd[index + 0], vertexd[index + 1], vertexd[index + 2]);
     t1p2.set(vertexd[index + 3], vertexd[index + 4], vertexd[index + 5]);
     t1p3.set(vertexd[index + 6], vertexd[index + 7], vertexd[index + 8]);
 
+    tri1.computeNormal(normalVec)
+
+    normald.push(normalVec.x, normalVec.y, normalVec.z)
+    normald.push(normalVec.x, normalVec.y, normalVec.z)
+    normald.push(normalVec.x, normalVec.y, normalVec.z)
+
     t2p1.set(vertexd[index + 9], vertexd[index + 10], vertexd[index + 11]);
     t2p2.set(vertexd[index + 12], vertexd[index + 13], vertexd[index + 14]);
     t2p3.set(vertexd[index + 15], vertexd[index + 16], vertexd[index + 17]);
 
+    tri2.computeNormal(normalVec)
+
+    normald.push(normalVec.x, normalVec.y, normalVec.z)
+    normald.push(normalVec.x, normalVec.y, normalVec.z)
+    normald.push(normalVec.x, normalVec.y, normalVec.z)
+
     let result = CGE.triangleIntersect(tri1, tri2);
 
     let result1 = result ? 0.25 : 0.75;
@@ -574,23 +592,38 @@ for (let i = 0; i < le; i++) {
 
 let endTime = Date.now(); 
 
+let index = []
+
+for (let i = 0, l = vertexd.length / 3; i < l; i++) {
+    index.push(i);
+}
+
 // console.log(startTime, endTime, endTime - startTime);
 
 // console.log(uvd);
 
 // console.log(results);
 
+const td = CGE.calcTangent(vertexd, uvd, normald, index);
+
 let triGeo = new CGE.Geometry();
 triGeo.addSingleAttribute('Position', CGE.ShaderConst.position, 3, CGE.FLOAT, vertexd);
 triGeo.addSingleAttribute('UV', CGE.ShaderConst.texcoord, 2, CGE.FLOAT, uvd);
+triGeo.addSingleAttribute('Normal', CGE.ShaderConst.normal, 3, CGE.FLOAT, new Float32Array(normald));
+triGeo.addSingleAttribute('Tangent', CGE.ShaderConst.tangent, 3, CGE.FLOAT, new Float32Array(td));
+
 // triGeo.setIndexData(indexd);
 triGeo.setDrawParameter(vertexd.length / 3);
+triGeo.buildBounding();
+let triTexture = new CGE.Texture2D();
+triTexture.setUrl('color.jpg');
+triTexture.setFilter(CGE.LINEAR, CGE.LINEAR);
+triTexture.setMipmap(true);
+
+let triMaterial = new CGE.StandardMaterial(triTexture);
 
-// let triTexture = new CGE.Texture2D();
-// triTexture.setImageUrl(color_diff);
-// triTexture.setFilter(CGE.LINEAR, CGE.LINEAR);
-// triTexture.setMipmap(true);
-let triMaterial = new CGE.DiffuseMaterial('color.jpg');
+triMaterial.setIrradianceMap(cubeTexture);
+triMaterial.setPrefilterMap(cubeTexture);
 
 let triMesh = new CGE.Mesh();
 triMesh.setGeometry(triGeo);
@@ -670,6 +703,14 @@ animater.addAnimationClip(aniClip);
 pl.animater = animater;
 animater.play('test');
 
+let lightGeo = new CGE.SphereGeometry(1, 32, 32);
+let baseMaterial = new CGE.ColorMaterial(new CGE.Vector4(1.0, 1.0, 0.0, 1.0));
+
+let lightMesh = new CGE.Mesh()
+lightMesh.setGeometry(lightGeo);
+lightMesh.setMaterial(baseMaterial);
+
+pl.addChild(lightMesh);
 
 // 以上 动画测试
 ///////////////////////////////////////////////////////////////////////////////////////