Three.js 加载单个 .obj 模型,如何显示顶点颜色
Three.js load a single .obj model , how to show vertex colors
我是 Three.js (3D) 的新手,有一个简单的问题。我有以下可以正常工作的代码,但我认为结果丢失了颜色,因为我用 3D Buidler(WIN10) 打开 test.obj 文件,模型表面有很多颜色。为什么?
代码
var loader = new THREE.OBJLoader()
loader.load( 'test.obj', function ( object ) {
object.position.y = 0;
scene.add( object );
} );
我认为是顶点颜色,如何显示它的顶点颜色?
var loader = new THREE.OBJLoader2()
loader.load( 'test.obj', function ( object ) {
object.position.y = 0;
scene.add( object );
} );
我试过了OBJLoader2.js,但是不行,需要一些设置吗?
Three.js加载的结果:
3D Builder加载的结果:
将 .mtl 文件与 .obj 文件一起使用。
var onProgress = function ( xhr ) {
if ( xhr.lengthComputable ) {
var percentComplete = xhr.loaded / xhr.total * 100;
console.log( Math.round(percentComplete, 2) + '% downloaded' );
}
};
var onError = function ( xhr ) { };
THREE.Loader.Handlers.add( /\.dds$/i, new THREE.DDSLoader() );
//Car model
var mtlLoader = new THREE.MTLLoader();
mtlLoader.setPath( '../materials/car/' );
mtlLoader.load( 'car.mtl', function( materials ) {
materials.preload();
var objLoader = new THREE.OBJLoader();
objLoader.setMaterials( materials );
objLoader.setPath( '../materials/car/' );
objLoader.load( 'car.obj', carObject, onProgress, onError );
});
function carObject(object){
object.rotation.y = 1.55;
object.position.z = 105;
object.position.y = 1.15;
object.scale.x = object.scale.y = object.scale.z = 0.15;
//object.rotation.x = 6.5;
//object.position.z = 50;
scene.add( object );
}
//end car model
最后我发现了:
我将 OBJLoader2.js 的版本更改为 1.3.0.
我是 Three.js (3D) 的新手,有一个简单的问题。我有以下可以正常工作的代码,但我认为结果丢失了颜色,因为我用 3D Buidler(WIN10) 打开 test.obj 文件,模型表面有很多颜色。为什么?
代码
var loader = new THREE.OBJLoader()
loader.load( 'test.obj', function ( object ) {
object.position.y = 0;
scene.add( object );
} );
我认为是顶点颜色,如何显示它的顶点颜色?
var loader = new THREE.OBJLoader2()
loader.load( 'test.obj', function ( object ) {
object.position.y = 0;
scene.add( object );
} );
我试过了OBJLoader2.js,但是不行,需要一些设置吗?
Three.js加载的结果:
3D Builder加载的结果:
将 .mtl 文件与 .obj 文件一起使用。
var onProgress = function ( xhr ) {
if ( xhr.lengthComputable ) {
var percentComplete = xhr.loaded / xhr.total * 100;
console.log( Math.round(percentComplete, 2) + '% downloaded' );
}
};
var onError = function ( xhr ) { };
THREE.Loader.Handlers.add( /\.dds$/i, new THREE.DDSLoader() );
//Car model
var mtlLoader = new THREE.MTLLoader();
mtlLoader.setPath( '../materials/car/' );
mtlLoader.load( 'car.mtl', function( materials ) {
materials.preload();
var objLoader = new THREE.OBJLoader();
objLoader.setMaterials( materials );
objLoader.setPath( '../materials/car/' );
objLoader.load( 'car.obj', carObject, onProgress, onError );
});
function carObject(object){
object.rotation.y = 1.55;
object.position.z = 105;
object.position.y = 1.15;
object.scale.x = object.scale.y = object.scale.z = 0.15;
//object.rotation.x = 6.5;
//object.position.z = 50;
scene.add( object );
}
//end car model
最后我发现了: 我将 OBJLoader2.js 的版本更改为 1.3.0.