使用JSONLoader在threejs上导入3d对象

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了使用JSONLoader在threejs上导入3d对象相关的知识,希望对你有一定的参考价值。

我正在尝试使用一个非常简单的3dobject,我使用jsonloader在我的threejs项目中使用Maya制作,但我有一些问题。 ojbect由几种不同的材料(Lambert和Phong)和不同的颜色组成。要创建.json文件,我使用Maya创建.obj然后Blender来制作.json并且一切看起来都很好但是当我尝试导入它时加载HIS材料我甚至无法加载模型,相反如果我使用随机加载材料我能够正确加载模型。

    var loader = new THREE.JSONLoader();
    loader.load("http://localhost:8000/object/planev2.json", function 
            (mygeo,mymat){
            var mat =  mymat[0];
            mymesh  = new THREE.Mesh(mygeo,mat);
            mymesh.scale.set(50,50,50); 
            scene.add( mymesh );
    });

TL:TR - 是否可以直接从.json加载由不同材料制作的对象?

答案

请尝试以下代码:

var material = new THREE.MeshPhongMaterial( {
                        color: 0xdddddd,
                        specular: 0x222222,
                        shininess: 35,
                        map: THREE.ImageUtils.loadTexture( "tex/map1.jpg" ),
                        specularMap: THREE.ImageUtils.loadTexture( "tex/map2.jpg" ),
                        normalMap: THREE.ImageUtils.loadTexture( "tex/map3.jpg" ),
                        normalScale: new THREE.Vector2( 1, 1 ),
                        morphTargets: true
                    } );

                    loader = new THREE.JSONLoader( );

                    loader.load( "mesh.json", function( geometry ) {

                        mesh = new THREE.Mesh( geometry, material );
                        mesh.name = "male";

                        scene.add(mesh);

                    });

                    loader.onLoadComplete = function () {

                        console.log("Loading is complete!");

                    }

以上是关于使用JSONLoader在threejs上导入3d对象的主要内容,如果未能解决你的问题,请参考以下文章

ThreeJS - 如何找到枢轴点

ThreeJS 不显示 dae 3D 模型

如何使用 babylonjs 或 threejs 预览 3D 中的 2D 平面对象? [关闭]

THREE.js<简单3D文件的导入>

在web端,three.js如何操作3d模型obj对象的子构件

ThreeJs 实例教学 -- 3D全景