什么技术将改善threejs模型的外观

时间:2015-04-15 06:09:20

标签: javascript three.js

我试图让我的3D模型显得有点“更好”。 - 我的意思是锯齿状边缘较少,阴影等更逼真。

目前我正在使用OBJ文件进行测试。我加载和显示文件的代码如下:

function LoadOBJMTL(file) {

var objObject = new THREE.Object3D;
var loader = new THREE.OBJMTLLoader();
var objfile = file + ".obj";
var mtlfile = file + ".mtl";

loader.load(objfile, mtlfile, function(object) {

    objObject = object;
    scene.add(objObject);

});

}

那里没什么特别的......

我的照亮场景的代码只有5个方向灯,如下所示:

addDirectionLight([-1, 0, 0], 1);
addDirectionLight([1, 0, 0], 1);
addDirectionLight([0, 0, -1], 1);
addDirectionLight([0, 0, 1], 1);
addDirectionLight([0, 1, 0], 1);

function addDirectionLight(direction, intensity) {
    var directionalLight = new THREE.DirectionalLight(0xffffff, intensity);
    directionalLight.position.set(direction[0], direction[1], direction[2]);
    scene.add(directionalLight);
}

这就是我的结果: enter image description here

作为对比,我已将相同的模型上传到veroldsketchfab

不确定sketchfab,但我知道verold是用three.js写的

Verold审判:enter image description here

Sketchfab试用版:enter image description here

我对verold和sketchfab示例中的外观感到满意。我应该使用哪些技术来改善我的threejs模型的外观?我看起来线条更直,照明条件更好。

提前致谢

1 个答案:

答案 0 :(得分:1)

修复锯齿状边缘:

renderer = new THREE.WebGLRenderer({ antialias: true });

很难评论照明。有很多一般的3D照明设置教程。