鍍金池/ 問答/HTML5  網(wǎng)絡(luò)安全  HTML/ WebGL模型一般怎么構(gòu)建到Threejs中

WebGL模型一般怎么構(gòu)建到Threejs中

1.需求:使用WebGL顯示一個(gè)室內(nèi)場景
2.看了一些方案,是使用 MaYa 或 Blender 建立場景,再導(dǎo)出到 THree.js 中
3.大家在開發(fā)場景中一般是怎么操作呢?可以分享一下嗎

回答
編輯回答
貓館

圖片描述
這是我之前做的一個(gè)demo,導(dǎo)入的3d模型文件是obj格式的,需要使用OBJLoader和MTLLoader,
mtl文件用于描述多邊形可視面貌的材質(zhì)
如果你可以導(dǎo)出obj、mtl文件的話,那么就可以使用下面的代碼把3d模型添加到three.js構(gòu)建的場景里了

function loadBuild() {
        var loader = new THREE.OBJLoader();
        var mtlLoader = new THREE.MTLLoader();

        mtlLoader.setPath( "city/" );
        mtlLoader.load('house.mtl', (mtl) => {
          mtl.preload();
          loader.setMaterials(mtl);
          loader.setPath("city/");
          // load a resource
          loader.load(
            // resource URL
            'house.obj',
            function ( object ) {
              const renderingParent = new THREE.Group();
              renderingParent.scale.set(0.3, 0.3, 0.3);

              renderingParent.add(object);
              scene.add( renderingParent );
            }
          );
        });
      }

也可以參考這個(gè)的源碼view-source:https://threejs.org/examples/webgl_loader_obj.html

2017年12月4日 22:19