javascript - Threejs编辑器中的对象更亮

问题描述

所以我在编辑器中导入了一个 FBX 对象，它看起来如下：

完美，这正是我所期待的！

但是当我制作场景并导入相同的对象时，它看起来像这样：

更暗，但为什么！

即使我使用的直射光强度与两者相同！

这些是我的编辑器对象：

这是我的额外简单代码：

var scene = new THREE.Scene();
scene.background = new THREE.Color( 0x9A9A9A );
var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );

var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

camera.position.z = 5;


var controls = new THREE.OrbitControls( camera, renderer.domElement );

//controls.update() must be called after any manual changes to the camera's transform
camera.position.set( 0, 20, 100 );
controls.update();

var directionalLight = new THREE.DirectionalLight( 0xffffff, 1 );
scene.add( directionalLight );
directionalLight.position.set(5,10,8);
var helper = new THREE.DirectionalLightHelper( directionalLight, 5 );
scene.add( helper );

var loader = new THREE.FBXLoader();

loader.load( '/assets/village/village_update.fbx', function ( object ) {
    object.traverse( function ( child ) {
        console.info( 'loaded' );
        if (child.isMesh) {
            child.receiveShadow = true;
            child.material.color.set( 0xffffff );
        }
    } );
    object.name = "village";
    console.log( 'adding it to scene' );
    scene.add( object );
});

var animate = function () {

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

我在这里想念什么？

编辑：

对于任何想要检查对象的人，您可以从这里下载：对象纹理

标签： javascriptthree.js

如果两个场景中的灯光相同，则看起来像是伽马不正确的问题。尝试设置renderer.outputEncoding = THREE.sRGBEncoding;，假设是three.js 的最新版本。在旧版本中，这将是renderer.gammaOutput = true;.

有关更多详细信息，请参阅three.js 中的颜色管理。

三.js r.112

javascript - Threejs编辑器中的对象更亮

问题描述

解决方案

推荐阅读