了解 .OBJ 3D 对象的位置
Understanding the position of .OBJ 3D objects
我正在尝试制作一个简单的 THREE.js-powered visualization of what various objects look like in scale to the Empire State Building. So I bought this very reasonably priced model for , which comes in several formats including .obj
. I then used THREE's OBJLoader 以将其添加到场景中。
container = document.getElementById("city");
camera = new THREE.PerspectiveCamera( 60, 1, 1, 2000 );
camera.position.set( 100, 0, -100 );
scene = new THREE.Scene();
scene.background = new THREE.Color( 0x87CEEB );
var ambientLight = new THREE.AmbientLight( 0xcccccc, 0.4 );
scene.add( ambientLight );
// load the ESB model
var loader = new THREE.OBJLoader();
loader.load(
'data/esb.obj',
function ( object ) { // called when resource is loaded
ESB = object;
scene.add( object );
},
function ( xhr ) { // called when loading is in progresses
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
function ( error ) {
console.log(error);
}
);
这成功加载了 OBJ 文件 -- demo here。 (我会放 CodePen 但无权重新分发 OBJ。请不要盗用它!)
但是,如您所见,虽然我添加了一些在远处隐约可见的 Axis Helper,但 ESB 从左侧漂浮在其一侧:
很明显,我不太了解 .obj 规范,尽管我已尝试阅读它。我的问题是:
- OBJ 文件是否具有绝对坐标,以至于出于某种原因,ESB 会偏离 <0,0,0> 的中心?
- 为什么它在移动? OBJ 文件是否有动力,或者这是我在 Three.js 中所做的事情的产物?
一如既往的感谢!
是的,ESB 的模型没有以原点为中心。如果将其导入 Blender,则可以轻松验证这一点。尝试通过以下方式将加载的 OBJ
重新定位到场景的中心:
var boundingBox = new THREE.Box3().setFromObject( object );
boundingBox.getCenter( object.position ).negate();
对象的移动与OBJ
格式无关。我猜某些应用程序级代码会导致此行为。
我正在尝试制作一个简单的 THREE.js-powered visualization of what various objects look like in scale to the Empire State Building. So I bought this very reasonably priced model for , which comes in several formats including .obj
. I then used THREE's OBJLoader 以将其添加到场景中。
container = document.getElementById("city");
camera = new THREE.PerspectiveCamera( 60, 1, 1, 2000 );
camera.position.set( 100, 0, -100 );
scene = new THREE.Scene();
scene.background = new THREE.Color( 0x87CEEB );
var ambientLight = new THREE.AmbientLight( 0xcccccc, 0.4 );
scene.add( ambientLight );
// load the ESB model
var loader = new THREE.OBJLoader();
loader.load(
'data/esb.obj',
function ( object ) { // called when resource is loaded
ESB = object;
scene.add( object );
},
function ( xhr ) { // called when loading is in progresses
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
function ( error ) {
console.log(error);
}
);
这成功加载了 OBJ 文件 -- demo here。 (我会放 CodePen 但无权重新分发 OBJ。请不要盗用它!)
但是,如您所见,虽然我添加了一些在远处隐约可见的 Axis Helper,但 ESB 从左侧漂浮在其一侧:
很明显,我不太了解 .obj 规范,尽管我已尝试阅读它。我的问题是:
- OBJ 文件是否具有绝对坐标,以至于出于某种原因,ESB 会偏离 <0,0,0> 的中心?
- 为什么它在移动? OBJ 文件是否有动力,或者这是我在 Three.js 中所做的事情的产物?
一如既往的感谢!
是的,ESB 的模型没有以原点为中心。如果将其导入 Blender,则可以轻松验证这一点。尝试通过以下方式将加载的 OBJ
重新定位到场景的中心:
var boundingBox = new THREE.Box3().setFromObject( object );
boundingBox.getCenter( object.position ).negate();
对象的移动与OBJ
格式无关。我猜某些应用程序级代码会导致此行为。