THREE.js - BufferGeometry (ObjLoader) 的顶点坐标
THREE.js - vertex's coordinates of BufferGeometry (ObjLoader)
我是 Three.js 的新手,在获取 2 个顶点的坐标时遇到了问题。我需要他们的 x、y、z 坐标来计算和绘制尺寸。
我使用了 ObjLoader 并且我确切地知道顶点的 ID(索引)- 11889 和 11877。
我尝试使用 BufferGeometry 的一些属性,但显然是错误的。所以这是我要使用的简单代码。
var coord1 = [11889,0,0,0], coord2 = [11877,0,0,0];
var mtlLoader = new THREE.MTLLoader();
mtlLoader.load(
'bath1.mtl',
function( materials )
{
materials.preload();
oLoader.setMaterials( materials );
oLoader.load('bath1.obj', function ( bath )
{
bath.name="bath1";
bath.position.y -=1; bath.position.x -=0.25; bath.position.z -=1;
scene.add( bath );
},
function ( xhr ) {},
function ( error ) {console.log( 'An error happened' );}
);
}
);
我读了几个类似的问题,但我无法针对我的问题调整答案。我应该怎么做才能获得坐标?谢谢!
作为一个选项,您可以使用 THREE.Vector3()
的 .fromArray()
方法,这样:
var geo = new THREE.PlaneBufferGeometry(5, 5);
var bath = new THREE.Mesh(geo, new THREE.MeshBasicMaterial());
var vert1 = new THREE.Vector3().fromArray(bath.geometry.attributes.position.array, 1 * 3);
var vert2 = new THREE.Vector3().fromArray(bath.geometry.attributes.position.array, 2 * 3);
console.log(vert1, vert2);
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/94/three.min.js"></script>
另一种方法是使用 THREE.BufferAttribute()
:
的 .getXXX()
方法
var geom = new THREE.PlaneBufferGeometry(5, 5);
var bath = new THREE.Mesh(geom, new THREE.MeshBasicMaterial());
var position = bath.geometry.attributes.position;
var x = position.getX(1);
var y = position.getY(1);
var z = position.getZ(1);
console.log(x, y, z);
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/94/three.min.js"></script>
我是 Three.js 的新手,在获取 2 个顶点的坐标时遇到了问题。我需要他们的 x、y、z 坐标来计算和绘制尺寸。
我使用了 ObjLoader 并且我确切地知道顶点的 ID(索引)- 11889 和 11877。
我尝试使用 BufferGeometry 的一些属性,但显然是错误的。所以这是我要使用的简单代码。
var coord1 = [11889,0,0,0], coord2 = [11877,0,0,0];
var mtlLoader = new THREE.MTLLoader();
mtlLoader.load(
'bath1.mtl',
function( materials )
{
materials.preload();
oLoader.setMaterials( materials );
oLoader.load('bath1.obj', function ( bath )
{
bath.name="bath1";
bath.position.y -=1; bath.position.x -=0.25; bath.position.z -=1;
scene.add( bath );
},
function ( xhr ) {},
function ( error ) {console.log( 'An error happened' );}
);
}
);
我读了几个类似的问题,但我无法针对我的问题调整答案。我应该怎么做才能获得坐标?谢谢!
作为一个选项,您可以使用 THREE.Vector3()
的 .fromArray()
方法,这样:
var geo = new THREE.PlaneBufferGeometry(5, 5);
var bath = new THREE.Mesh(geo, new THREE.MeshBasicMaterial());
var vert1 = new THREE.Vector3().fromArray(bath.geometry.attributes.position.array, 1 * 3);
var vert2 = new THREE.Vector3().fromArray(bath.geometry.attributes.position.array, 2 * 3);
console.log(vert1, vert2);
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/94/three.min.js"></script>
另一种方法是使用 THREE.BufferAttribute()
:
.getXXX()
方法
var geom = new THREE.PlaneBufferGeometry(5, 5);
var bath = new THREE.Mesh(geom, new THREE.MeshBasicMaterial());
var position = bath.geometry.attributes.position;
var x = position.getX(1);
var y = position.getY(1);
var z = position.getZ(1);
console.log(x, y, z);
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/94/three.min.js"></script>