Venus: ThreeJS FBXLoader

01.关于3D文件格式的选择

threejs提供了很多格式的 Loader
但是却只提供了 obj 格式的使用文档, 而 obj 格式是不能存储骨骼信息的
json格式的使用较为方便,网上例子很多,但是3Dmax要插件才能导出
最后敲定用FBX, 通过看官网的example来了解FBXLoader的使用
FBXLoader example

02. FBXLoader的使用例子

var loader = new THREE.FBXLoader();

        loader.load(

            './model/current.FBX',

            function( object ) {
                
                object.traverse( function( child ) {

                        console.log( child );

                        try {

                            if ( child instanceof THREE.SkinnedMesh ) {

                                child.material.wireframe = true;
                                
                            }
                            // console.log( child );

                            if( child instanceof THREE.Bone ) {
                                    if( 
                                        child.name == 'left' || child.name == 'right' || 
                                        child.name == 'Bone001' || child.name == 'Bone002' || child.name == 'Bone003'
                                    ) {

                                    } else {
                                        folder = gui.addFolder( child.name )
                                        folder.add( child.rotation, 'x', - Math.PI, Math.PI );
                                        folder.add( child.rotation, 'y', - Math.PI, Math.PI );
                                        folder.add( child.rotation, 'z', - Math.PI, Math.PI );
                                    }
                            }

                        }

                        catch( e ) {

                            console.log( e );

                        }

                } );

这其中最重要的一段代码就是

object.traverse( function() { ... } );
traverse是一个迭代器,它会将组成模型的部件一个一个提取出来, 通过控制台查看console.log()输出的信息就能明白这一点

输出信息.PNG

看type那一项: SkinnedMesh, Bone, Bone, Bone ...
每个组成部分都有很多属性, 最有用的是: name, type
通过 child.name 这样的形式来访问属性