l

build/fyge.min.js

@@ -16211,9 +16211,9 @@ var D3Renderer = (function (_super) {
                     glVaoBuffer.indexBuffer = glCore_1.GLBuffer.createIndexBuffer(gl, null, gl.STATIC_DRAW);
                 if (geo._morphPositions) {
                     glVaoBuffer.morphTargetBuffers = [];
-                    for (var m = 0; m < geo._morphPositions.length; m++) {
-                        glVaoBuffer.morphTargetBuffers.push(glCore_1.GLBuffer.createVertexBuffer(gl, null, gl.STATIC_DRAW));
-                    }
+                }
+                if (geo._morphNormals) {
+                    glVaoBuffer.morphNormalBuffers = [];
                 }
                 packGeometry(geo);
             }
@@ -16228,19 +16228,29 @@ var D3Renderer = (function (_super) {
                     vao.addAttribute(glVaoBuffer.attrBuffer, attrs.aNormal, gl.FLOAT, false, geo._vertByteSize, 8 * 4);
                 if (geo._indices)
                     vao.addIndex(glVaoBuffer.indexBuffer);
+                var uploadBufferDatas;
+                if (mesh.morphTargetInfluences && mat.morphTargets) {
+                    uploadBufferDatas = addMorphtargetsAttr(mesh.morphTargetInfluences, geo, glVaoBuffer, vao, curShader, gl);
+                }
                 this.renderer.bindVao(vao);
                 glVaoBuffer.attrBuffer.upload(geo._attrBuffer.vertices, 0, false);
                 if (geo._indices)
                     glVaoBuffer.indexBuffer.upload(geo._indices, 0, false);
-                if (geo._morphPositions) {
-                    var len = geo._morphNormals ? 4 : 8;
-                    for (var n = 0; n < len; n++) {
-                        glVaoBuffer.morphTargetBuffers[n];
-                    }
-                }
+                if (uploadBufferDatas)
+                    uploadBufferDatas.forEach(function (e) {
+                        e.buffer.upload(e.data, 0, false);
+                    });
             }
             else {
+                var uploadBufferDatas;
+                if (mesh.morphTargetInfluences && mat.morphTargets) {
+                    uploadBufferDatas = addMorphtargetsAttr(mesh.morphTargetInfluences, geo, glVaoBuffer, vao, curShader, gl);
+                }
                 this.renderer.bindVao(vao);
+                if (uploadBufferDatas)
+                    uploadBufferDatas.forEach(function (e) {
+                        e.buffer.upload(e.data, 0, true);
+                    });
             }
             if (mat.side == BaseMaterial_1.RenderSideType.DoubleSide) {
                 this.renderer.state.setCullFace(0);
@@ -16273,6 +16283,91 @@ function packGeometry(geo) {
         float32View[count++] = geo._normals[j * 3 + 2];
     }
 }
+var influencesList = {};
+var attrChannelHash = {};
+var morphInfluences = new Float32Array(8);
+function addMorphtargetsAttr(objectInfluences, geo, glVaoBuffer, vao, shader, gl) {
+    var morphTargets = geo._morphPositions;
+    var morphNormals = geo._morphNormals;
+    var length = objectInfluences.length;
+    var uploadBufferDatas = [];
+    var influences = influencesList[geo.instanceId];
+    if (!influences) {
+        influences = [];
+        for (var i = 0; i < length; i++) {
+            influences[i] = [i, 0];
+        }
+        influencesList[geo.instanceId] = influences;
+    }
+    var attrChannel = attrChannelHash[geo.instanceId];
+    if (!attrChannel) {
+        attrChannel = [];
+        attrChannel.length = 8;
+        attrChannelHash[geo.instanceId] = attrChannel;
+    }
+    for (var i = 0; i < 8; i++) {
+        var influence = influences[i];
+        if (influence && influence[1] !== 0) {
+            if (morphTargets)
+                vao.removeAttribute('morphTarget' + i);
+            if (morphNormals && i < 4)
+                vao.removeAttribute('morphNormal' + i);
+        }
+    }
+    for (var i = 0; i < length; i++) {
+        var influence = influences[i];
+        influence[0] = i;
+        influence[1] = objectInfluences[i];
+    }
+    influences.sort(absNumericalSort);
+    var attrs = shader.attributes;
+    var attrLen = morphNormals ? 4 : 8;
+    for (var i = 0; i < attrLen; i++) {
+        var influence = influences[i];
+        if (influence) {
+            var index = influence[0];
+            var value = influence[1];
+            if (value) {
+                if (morphTargets && morphTargets[index]) {
+                    var targetBuffer = glVaoBuffer.morphTargetBuffers[index];
+                    if (!targetBuffer) {
+                        targetBuffer = glVaoBuffer.morphTargetBuffers[index] = glCore_1.GLBuffer.createVertexBuffer(gl, null, gl.STATIC_DRAW);
+                    }
+                    if (attrChannel[i] !== index) {
+                        attrChannel[i] = index;
+                        uploadBufferDatas.push({
+                            buffer: targetBuffer,
+                            data: new Float32Array(morphTargets[index])
+                        });
+                    }
+                    vao.addAttribute(targetBuffer, attrs['morphTarget' + i], gl.FLOAT, false, 0, 0 * 4, 'morphTarget' + i);
+                }
+                if (morphNormals && morphNormals[index]) {
+                    var normalBuffer = glVaoBuffer.morphNormalBuffers[index];
+                    if (!normalBuffer) {
+                        normalBuffer = glVaoBuffer.morphNormalBuffers[index] = glCore_1.GLBuffer.createVertexBuffer(gl, null, gl.STATIC_DRAW);
+                    }
+                    if (attrChannel[i] !== index) {
+                        attrChannel[i] = index;
+                        uploadBufferDatas.push({
+                            buffer: normalBuffer,
+                            data: morphNormals[index]
+                        });
+                    }
+                    vao.addAttribute(glVaoBuffer.morphNormalBuffers[index], attrs['morphNormal' + i], gl.FLOAT, false, 0, 0 * 4, 'morphNormal' + i);
+                }
+                morphInfluences[i] = value;
+                continue;
+            }
+        }
+        morphInfluences[i] = 0;
+    }
+    shader.uniforms["morphTargetInfluences"] = morphInfluences;
+    return uploadBufferDatas;
+}
+function absNumericalSort(a, b) {
+    return Math.abs(b[1]) - Math.abs(a[1]);
+}
 WebglRenderer_1.WebglRenderer.registerPlugin('d3', D3Renderer);
 
 
@@ -16493,6 +16588,13 @@ var Mesh3D = (function (_super) {
         _this.updateMorphTargets();
         return _this;
     }
+    Object.defineProperty(Mesh3D.prototype, "morphTargetInfluences", {
+        get: function () {
+            return this._morphTargetInfluences;
+        },
+        enumerable: true,
+        configurable: true
+    });
     Mesh3D.prototype._render = function (renderer) {
         if (!this.visible)
             return;
@@ -16502,9 +16604,9 @@ var Mesh3D = (function (_super) {
     Mesh3D.prototype.updateMorphTargets = function () {
         var morphPositions = this.geometry._morphPositions;
         if (morphPositions) {
-            this.morphTargetInfluences = [];
+            this._morphTargetInfluences = [];
             for (var i = 0; i < morphPositions.length; i++)
-                this.morphTargetInfluences.push(0);
+                this._morphTargetInfluences.push(0);
         }
     };
     Mesh3D.prototype.raycast = function (raycaster, intersects) {
@@ -16560,6 +16662,14 @@ var Mesh3D = (function (_super) {
         }
     };
     ;
+    Mesh3D.prototype.copy = function (source, recursive) {
+        if (recursive === void 0) { recursive = true; }
+        _super.prototype.copy.call(this, source, recursive);
+        if (source.morphTargetInfluences) {
+            this._morphTargetInfluences = source.morphTargetInfluences.slice();
+        }
+        return this;
+    };
     Mesh3D.prototype.clone = function () {
         return new Mesh3D(this.geometry, this.material).copy(this);
     };
@@ -21433,7 +21543,7 @@ var VertexArrayObject = (function () {
         return this;
     };
     ;
-    VertexArrayObject.prototype.addAttribute = function (buffer, attribute, type, normalized, stride, start) {
+    VertexArrayObject.prototype.addAttribute = function (buffer, attribute, type, normalized, stride, start, name) {
         this.attributes.push({
             buffer: buffer,
             attribute: attribute,
@@ -21441,12 +21551,26 @@ var VertexArrayObject = (function () {
             type: type || this.gl.FLOAT,
             normalized: normalized || false,
             stride: stride || 0,
-            start: start || 0
+            start: start || 0,
+            name: name,
         });
         this.dirty = true;
         return this;
     };
     ;
+    VertexArrayObject.prototype.removeAttribute = function (name, onlyOne) {
+        if (onlyOne === void 0) { onlyOne = true; }
+        var len = this.attributes.length;
+        for (var i = len - 1; i >= 0; i--) {
+            var attr = this.attributes[i];
+            if (attr.name === name) {
+                this.attributes.splice(i, 1);
+                if (onlyOne)
+                    break;
+            }
+        }
+        return this;
+    };
     VertexArrayObject.prototype.addIndex = function (buffer) {
         this.indexBuffer = buffer;
         this.dirty = true;

src/3D/Geometry.ts

@@ -137,7 +137,7 @@ export class Geometry extends HashObject {
 /**
  * 根据webglRendererId存一个，vao还需要根据着色器程序缓存
  */
-interface VaoBufferInt {
+export interface VaoBufferInt {
     /**
      * 索引
      */

src/3D/Mesh3D.ts

@@ -15,11 +15,12 @@ const tempPoint = new Vector3();
 
 export class Mesh3D extends Object3D {
     /**
-     * 外部可设置
-     * 用于变形权重，
-     * 最大长度8
+     * 用于变形权重，只能获取，修改只能内部修改
      */
-    public morphTargetInfluences: number[];
+    private _morphTargetInfluences: number[];
+    get morphTargetInfluences() {
+        return this._morphTargetInfluences;
+    }
     //这个暂时不知道有啥用，到时看three的
     // morphTargetDictionary
     constructor(
@@ -38,9 +39,9 @@ export class Mesh3D extends Object3D {
     updateMorphTargets() {
         var morphPositions = this.geometry._morphPositions;
         if (morphPositions) {
-            this.morphTargetInfluences = [];
+            this._morphTargetInfluences = [];
             //根据morphPositions的长度来定权重长度
-            for (var i = 0; i < morphPositions.length; i++) this.morphTargetInfluences.push(0);
+            for (var i = 0; i < morphPositions.length; i++) this._morphTargetInfluences.push(0);
         }
     }
 
@@ -123,7 +124,17 @@ export class Mesh3D extends Object3D {
             }
         }
     };
-
+    copy(source: Mesh3D, recursive: boolean = true) {
+        super.copy(source, recursive);
+        if (source.morphTargetInfluences) {//变形的数据
+            this._morphTargetInfluences = source.morphTargetInfluences.slice();
+        }
+        //暂时不用
+        // if ( source.morphTargetDictionary !== undefined ) {
+        // 	this.morphTargetDictionary = Object.assign( {}, source.morphTargetDictionary );
+        // }
+        return this
+    }
     /**
      * 
      */

src/glCore/VertexArrayObject.ts

@@ -152,7 +152,7 @@ export class VertexArrayObject {
      * @param start      {Number}
      * @param name       {string} 名字，用于移除，否则不需要传
      */
-    public addAttribute(buffer, attribute, type?, normalized?, stride?, start?, name?: number) {
+    public addAttribute(buffer, attribute, type?, normalized?, stride?, start?, name?: string) {
         this.attributes.push({
             buffer: buffer,
             attribute: attribute,

test/test.html

@@ -45,7 +45,7 @@
         <canvas id="canvas" style="width: 100%;height: 100%"></canvas>
     </div>
     <!-- 帧率检测 -->
-    <!-- <script src="js/stats.js"></script> -->
+    <script src="//yun.duiba.com.cn/db_games/libs0924/stats.js"></script>
 </body>
 <script>
     window.addEventListener("load", async function () {
@@ -155,13 +155,28 @@
 
             //立方体几何
             var geo = new FYGE.BoxGeometry(4, 4, 4)
+            geo._morphPositions = []
+            for (let i = 0; i < 1; i++) {
+                let v = geo._vertices.slice();
+                // console.log(v)
+                for (var j = 0; j < v.length; j++) {
+                    // v[j] += 2
+                    v[j] *= 2
+                }
+                geo._morphPositions.push(v)
+            }
+            console.log()
+            // console.log( new Float32Array(v))
             //光照材质
             var matL = new FYGE.LightMaterial();
             matL.map = texture;//加个贴图
+            matL.side = 2
             // matL.color=0xff0000
             // matL.alpha=0.5
             // matL.wireframe=true
             var m = scene.addChild(new FYGE.Mesh3D(geo, matL))
+            matL.morphTargets = true
+            // m.morphTargetInfluences = [0]
             m.position.set(0, 0, 0)
             // m.scale.set(1.3, 1.3, 1.3)
             // m.rotation.set(0,Math.PI/12,0)
@@ -171,6 +186,16 @@
             // m.visible = false;
             m.position.y = 0
             m.addEventListener(FYGE.MouseEvent.CLICK, () => { console.log(123123) }, this)
+            let mm = m;
+            m.addEventListener(FYGE.Event.ENTER_FRAME, () => {
+                var morph = Math.abs(Math.sin(mm.rotation.y)) * 1
+
+                mm.morphTargetInfluences[0] = morph
+                // mm.morphTargetInfluences[1] = morph
+                // mm.morphTargetInfluences[2] = morph
+                // mm.morphTargetInfluences[3] = morph
+
+            })
 
             //不带光找的材质
             var mat1 = new FYGE.BaseMaterial();