Javascript Three.js-尝试使用WebGL-蒙皮网格化身

我一直在尝试使用WebGL（three.js r71）在Safari上显示一个化身（皮肤网格）。代码如下（我已经设置了相机、照明、场景和渲染器）：

---

删除材质[0]时，蒙皮=true；我在浏览器上显示了我的头像，但骨骼不会移动。你知道我必须启用蒙皮才能旋转骨骼吗？

我已经解决了这个问题。是的，我必须启用蒙皮才能旋转骨骼。

使用非精简版本——three.js，而不是three.min.js——进行开发和调试。逐步使用调试器。我应该使用Three.js还是Three.js？我尝试了three.js（r71），它给了我类似的问题：“TypeError:undefined不是对象（计算'bones[gbone.parent].add'）。当我使用three.js时，创建场景时出错。此外，如何使用调试器？我试图单击“单步执行”按钮，但它不起作用。我刚刚使用了调试器，HTML文件不再给我错误。现在的问题是没有显示化身。现在我真的不知道问题出在哪里了。我已经把头像改成了一个不将网格/骨骼的父项赋值为空的头像，并且成功了。但现在我得到了一个新的错误：“TypeError:undefined不是对象（计算'data.initialized'）”。你知道怎么修吗？我使用的是three.js（r71），它已经修复了#5542 bug（）。

loader = new THREE.JSONLoader();  
            loader.load( 'models/avatar.json', addModel );

            guiControls = new function() {

                this.mPelvis = 0.0;
                this.mTorso = 0.0;
                this.mChest = 0.0;
                this.mNeck = 0.0;
                this.mHead = 0.0;
                this.mSkull = 0.0;
                this.mEyeRight = 0.0;
                this.mEyeLeft = 0.0;
                this.mCollarLeft = 0.0;
                this.mShoulderLeft = 0.0;
                this.mElbowLeft = 0.0;
                this.mWristLeft = 0.0;
                this.mCollarRight = 0.0;
                this.mShoulderRight = 0.0;
                this.mElbowRight = 0.0;
                this.mWristRight = 0.0;
                this.mHipRight = 0.0;
                this.mKneeRight = 0.0;
                this.mAnkleRight = 0.0;
                this.mFootRight = 0.0;
                this.mToeRight = 0.0;
                this.mHipLeft = 0.0;
                this.mKneeLeft = 0.0;
                this.mAnkleLeft = 0.0;
                this.mFootLeft = 0.0;
                this.mToeLeft = 0.0;

                this.rotationX = 0.001;
                this.rotationY = 0.001;
                this.rotationZ = 0.001;

                this.scaleX = 3;
                this.scaleY = 3;
                this.scaleZ = 3;

                this.scene = function(){
                console.log(scene);

                };
            }




            datGUI = new dat.GUI();

            datGUI.add(guiControls, "scene");

            var cfolder = datGUI.addFolder('Controls');

            cfolder.add(guiControls, 'mPelvis',-1.57, 1.57); 
            cfolder.add(guiControls, 'mTorso',-1.57, 1.57);    
            cfolder.add(guiControls, 'mChest',-1.57, 1.57);   
            cfolder.add(guiControls, 'mNeck',-1.57, 1.57);    
            cfolder.add(guiControls, 'mHead',-1.57, 1.57);   
            cfolder.add(guiControls, 'mSkull',-1.57, 1.57);    
            cfolder.add(guiControls, 'mEyeRight',-1.57, 1.57);   
            cfolder.add(guiControls, 'mEyeLeft',-1.57, 1.57);    
            cfolder.add(guiControls, 'mCollarLeft',-1.57, 1.57);   
            cfolder.add(guiControls, 'mShoulderLeft',-1.57, 1.57);    
            cfolder.add(guiControls, 'mElbowLeft',-1.57, 1.57);   
            cfolder.add(guiControls, 'mWristLeft',-1.57, 1.57);    
            cfolder.add(guiControls, 'mCollarRight',-1.57, 1.57);   
            cfolder.add(guiControls, 'mShoulderRight',-1.57, 1.57);    
            cfolder.add(guiControls, 'mElbowRight',-1.57, 1.57); 
            cfolder.add(guiControls, 'mWristRight',-1.57, 1.57);   
            cfolder.add(guiControls, 'mHipRight',-1.57, 1.57);   
            cfolder.add(guiControls, 'mKneeRight',-1.57, 1.57);    
            cfolder.add(guiControls, 'mAnkleRight',-1.57, 1.57);   
            cfolder.add(guiControls, 'mFootRight',-1.57, 1.57);    
            cfolder.add(guiControls, 'mToeRight',-1.57, 1.57);   
            cfolder.add(guiControls, 'mHipLeft',-1.57, 1.57);    
            cfolder.add(guiControls, 'mKneeLeft',-1.57, 1.57);   
            cfolder.add(guiControls, 'mAnkleLeft',-1.57, 1.57);    
            cfolder.add(guiControls, 'mFootLeft',-1.57, 1.57);   
            cfolder.add(guiControls, 'mToeLeft',-1.57, 1.57);    


            var rfolder = datGUI.addFolder('Rotation');

            rfolder.add(guiControls, 'rotationX', -1 ,1);
            rfolder.add(guiControls, 'rotationY', -1 ,1);
            rfolder.add(guiControls, 'rotationZ', -1 ,1);


            var sfolder = datGUI.addFolder('Scale');

            sfolder.add(guiControls, 'scaleX', 0 , 1);
            sfolder.add(guiControls, 'scaleY', 0 , 1);
            sfolder.add(guiControls, 'scaleZ', 0 , 1);

            datGUI.close();

            var helpset;


            function addModel( geometry,  materials ){

                    materials[0].skinning = true;
                    objeto= new THREE.SkinnedMesh( geometry, new THREE.MeshFaceMaterial(materials));
                    scene.add(objeto);

                    helpset = new THREE.SkeletonHelper(objeto);
            //      scene.add(helpset);

            } 

        }

        // Your render function
        function render() {

            scene.traverse(function(child) {
                if (child instanceof THREE.SkinnedMesh){  

                    child.rotation.y += .01;
                    child.scale.x = guiControls.scaleX;
                    child.scale.y = guiControls.scaleY;
                    child.scale.z = guiControls.scaleZ;

                    child.rotation.x = guiControls.rotationX;
                    child.rotation.y = guiControls.rotationY;
                    child.rotation.z = guiControls.rotationZ;

                    child.skeleton.bones[0].rotation.z = guiControls.mPelvis;
                    child.skeleton.bones[1].rotation.z = guiControls.mTorso;
                    child.skeleton.bones[2].rotation.z = guiControls.mChest;
                    child.skeleton.bones[3].rotation.z = guiControls.mNeck;
                    child.skeleton.bones[4].rotation.z = guiControls.mHead;
                    child.skeleton.bones[5].rotation.z = guiControls.mSkull;
                    child.skeleton.bones[6].rotation.z = guiControls.mEyeRight;
                    child.skeleton.bones[7].rotation.z = guiControls.mEyeLeft;
                    child.skeleton.bones[8].rotation.z = guiControls.mCollarLeft;
                    child.skeleton.bones[9].rotation.z = guiControls.mShoulderLeft;
                    child.skeleton.bones[10].rotation.z = guiControls.mElbowLeft;
                    child.skeleton.bones[11].rotation.z = guiControls.mWristLeft;
                    child.skeleton.bones[12].rotation.z = guiControls.mCollarRight;
                    child.skeleton.bones[13].rotation.z = guiControls.mShoulderRight;
                    child.skeleton.bones[14].rotation.z = guiControls.mElbowRight;
                    child.skeleton.bones[15].rotation.z = guiControls.mWristRight;
                    child.skeleton.bones[16].rotation.z = guiControls.mHipRight;
                    child.skeleton.bones[17].rotation.z = guiControls.mKneeRight;
                    child.skeleton.bones[18].rotation.z = guiControls.mAnkleRight;
                    child.skeleton.bones[19].rotation.z = guiControls.mFootRight;
                    child.skeleton.bones[20].rotation.z = guiControls.mToeRight;
                    child.skeleton.bones[21].rotation.z = guiControls.mHipLeft;
                    child.skeleton.bones[22].rotation.z = guiControls.mKneeLeft;
                    child.skeleton.bones[23].rotation.y = guiControls.mAnkleLeft;
                    child.skeleton.bones[24].rotation.y = guiControls.mFootLeft;
                    child.skeleton.bones[25].rotation.y = guiControls.mToeLeft;

                }

                else if  (child instanceof THREE.SkeletonHelper){
                    child.update();
                }
            });

        }

        function animate(){


            render();
            renderer.render(scene, camera);
            requestAnimationFrame(animate);

        }

        init();
        animate();