экспорт blender gltf выглядит странно при загрузке в three.js - PullRequest
Новая
       19

экспорт blender gltf выглядит странно при загрузке в three.js

0 голосов
/ 20 октября 2019

Я экспортировал простой куб с материалом из Blender в виде файла GLTF (GLB). При загрузке в three.js он выглядит не так, как если бы я смотрел внутри куба.

В моем примере я поместил рядом: - сетку, загруженную из файла GLTF (слева на изображении - сетка с BoxBufferGeometry и MeshStandardMaterial (справа на изображении). У меня есть рассеянный свет (HemisphereLight) и основной свет (DirectionalLight). Созданная сетка выглядит нормально, но загруженная сетка выглядит странно. При экспорте из blender я старался не экспортировать нормали;стало немного лучше, но в основном я получаю тот же результат. Похоже, я смотрю на внутреннюю часть куба. 

let container;
let camera;
let renderer;
let scene;
let mesh;

function init() {
    container = document.querySelector( '#scene-container' );

    scene = new THREE.Scene();
    scene.background = new THREE.Color( 0x8FBCD4 );

    createCamera();
    createLights();
    createMeshes();
    createRenderer();

    renderer.setAnimationLoop( () => {

        render();

  } );
}

function createCamera() {
    camera = new THREE.PerspectiveCamera(
        35, // FOV
        container.clientWidth / container.clientHeight, //aspect
        0.1, // near clipping plane
        100, // far clipping plane
    );
    camera.position.set( -1, 1, 10 );
}

function createMeshes() {
    const geometry = new THREE.BoxBufferGeometry( 2, 2, 2 );
    const material = new THREE.MeshStandardMaterial( { color: 0x800080 } );
    mesh = new THREE.Mesh( geometry, material );
    scene.add( mesh );
    mesh.position.set(2.5, 0, 0);

    var loader = new THREE.GLTFLoader();
    loader.load('models/teste.glb',
                function ( gltf ) {scene.add( gltf.scene );},
                // called while loading is progressing
                function ( xhr ) {console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );},
                function ( error ) {console.log( 'An error happened' );}
                );
}

function createLights() {
    const ambientLight = new THREE.HemisphereLight(
    0xddeeff, 
    0x202020, 
    5, 
    );

    const mainLight = new THREE.DirectionalLight( 0xffffff, 5 );
    mainLight.position.set( 10, 10, 10 );

    scene.add( ambientLight, mainLight );
}


function createRenderer() {
    renderer = new THREE.WebGLRenderer( { antialias: true } );
    renderer.setSize( container.clientWidth, container.clientHeight );
    renderer.setPixelRatio( window.devicePixelRatio );
    container.appendChild( renderer.domElement );
}

function render() {
    renderer.render( scene, camera );
}

init();

Я ожидаю, что левый куб (GLTF) будет выглядеть как правый.

1 Ответ

0 голосов
/ 20 октября 2019

Я нашел ответ. Я на Блендер 2.79. Я должен использовать старую версию аддона (https://github.com/KhronosGroup/glTF-Blender-Exporter)

...