Three.js collada 3D对象鼠标事件
Three.js collada 3D对象鼠标事件,three.js,collada,Three.js,Collada,大家好, 我想在鼠标悬停时更改3D对象(collada文件)子对象的颜色。 我尝试使用Raycaster方法,但不起作用。 喜欢样品 但我想在鼠标悬停时更改颜色或突出显示模型子对象 这是我的密码 var oLoader = new THREE.ColladaLoader(); oLoader.load('model/sample.dae', function (collada) { var
大家好,
我想在鼠标悬停时更改3D对象(collada文件)子对象的颜色。
我尝试使用Raycaster方法,但不起作用。
喜欢样品
但我想在鼠标悬停时更改颜色或突出显示模型子对象 这是我的密码
var oLoader = new THREE.ColladaLoader();
oLoader.load('model/sample.dae', function (collada) {
var object = collada.scene;
var skin = collada.skins[0];
object.rotation.x = -Math.PI / 2;
object.rotation.z = Math.PI / 2;
object.position.x = 0;
object.position.y = 0;
object.position.z = 0;
object.scale.set(0.025, 0.025, 0.025);
object.updateMatrix();
scene.add(object);
请告诉我怎么做。非常感谢。巧合的是,我也在做一个需要鼠标事件的项目,并编写了一个小对象来使用
var mouse = {
getIntersects: function( camera, sceneChildren, event ){
event = event || window.event;
var mouseX = ( event.clientX / window.innerWidth ) * 2 - 1;
var mouseY = -( event.clientY / window.innerHeight ) * 2 + 1;
var vector = new THREE.Vector3( mouseX, mouseY, camera.near );
vector.unproject( camera );
var raycaster = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() );
var intersects = raycaster.intersectObjects( sceneChildren );
if ( intersects.length > 0 ) {
//console.log(intersects);
return intersects;
}
return false;
},
Position3D: function(sceneChildren){
var intersects = mouse.getIntersects( sceneChildren );
return intersects[0].point
}
}
我不知道您是想单独使用此对象,还是想将其用作自己编写代码的引用,但以下是您如何使用它:
document.addEventListener('click', function(event){
var intersectObj = mouse.getIntersects( camera, scene.children, event)[0];
if(window.console){
console.log(intersectObj);
}
else{
alert(intersectObj);
}
});
现在,您已将单击的对象全部整理好,可以开始使用函数了。最简单的方法就是将它们添加到网格中。因此:
var mesh = new THREE.Mesh(geometry, material);
mesh.click = function(){
alert('object was clicked');
}
谢谢你的回答,我试试看。