Привет. Требуется помощь. Имеется объект, загруженный в формате obj+mtl на сцену three js. Имеется взаимодействие данного объекта с raycasting (при двойном клике объект перемещается). Все работает. Но возникла необходимость данный объект(ы) загружать в формате gltf. Объект загружается, но взаимодействие происходит только с одним элементом объекта gltf. Вот ссылка на короткое видео для объяснения проблемы: https://youtu.be/wLSigsADD3.
загрузчик obj:
//-------- it was the code to load the model in the obj format:
var loaderKitchen1Path1Door27 = new THREE.MTLLoader();
var loadPathD271 = loadPath+'magia1_part3_door27.mtl';
var loadPathD272 = loadPath+'magia1_part3_door27.obj';
loaderKitchen1Path1Door27.load(loadPathD271, function(matK1P1Door27){
matK1P1Door27.preload();
var objLoaderK1P1Door27 = new THREE.OBJLoader();
objLoaderK1P1Door27.setMaterials(matK1P1Door27);
objLoaderK1P1Door27.load(loadPathD272, function(meshK1P1Door27){
//----------------bbox----------
var door27Bbox = new THREE.Box3();
door27Bbox.setFromObject(meshK1P1Door27);
var bboxDoor27Center = door27Bbox.getCenter().clone();
bboxDoor27Center.multiplyScalar(-1);
meshK1P1Door27.traverse(function(child){
child.castShadow = true;
child.receiveShadow = true;
if (child instanceof THREE.Mesh){
child.geometry.translate(bboxDoor27Center.x, bboxDoor27Center.y, bboxDoor27Center.z);
door[27].id = child.id;
}
});
door27Bbox.setFromObject(meshK1P1Door27);
//------------------------------------------------
cubeAs[27].add(meshK1P1Door27);
meshK1P1Door27.position.set((-door[27].cubeAs27X),0,(-door[27].cubeAs27Z));//-1.36,0.471, 2.435465
meshK1P1Door27.rotation.y = Math.PI;
});
});
//---------end loading obj
загрузчик gltf:
//-----now I want to load gltf:
var loaderKitchen1Path1Door27 = new GLTFLoader();
loaderKitchen1Path1Door27.load('models/door27.gltf', function(meshK1P1Door27){
meshK1P1Door27.scene;
//----------------bbox----------
var door27Bbox = new THREE.Box3();
door27Bbox.setFromObject(meshK1P1Door27.scene);
var bboxDoor27Center = door27Bbox.getCenter().clone();
bboxDoor27Center.multiplyScalar(-1);
meshK1P1Door27.scene.traverse(function(child){
child.castShadow = true;
child.receiveShadow = true;
if (child instanceof THREE.Mesh){
child.geometry.translate(bboxDoor27Center.x, bboxDoor27Center.y, bboxDoor27Center.z);
}
});
//------------------------------------------------
cubeAs[27].add(meshK1P1Door27.scene);
meshK1P1Door27.scene.position.set((-door[27].cubeAs27X),0,(-door[27].cubeAs27Z));//-1.36,0.471, 2.435465
meshK1P1Door27.scene.rotation.y = Math.PI;
});
обработчик события:
//-----------here I use raycasting to detect Object
//statsNode.innerHTML = '';
var raycaster = new THREE.Raycaster();
var projector = new Projector();
var directionVector = new THREE.Vector3();
function getIntersects( x, y ) {
x = ( x / window.innerWidth ) * 2 - 1;
y = - ( y / window.innerHeight ) * 2 + 1;
var z = 0.5;
directionVector.set( x, y, z );
projector.unprojectVector(directionVector, camera);
directionVector.sub(camera.position);
directionVector.normalize();
raycaster.set(camera.position, directionVector);
var rayCube = raycaster.intersectObjects( scene.children, true );
if (rayCube.length) {
var target1 = rayCube[0].object;
if (target1.id === door[27].id){
return rayCube;
}
}
}
//--------------
Как сделать так, чтобы объект gltf был как единое целое (также как и объект obj)?