我从一个加载到我场景中的blender导出动画。我想要实现的是单击对象,对象通过它的关键帧动画50%并停止,然后如果我再次单击该对象,其余50%的关键帧将被迭代。
到目前为止,我的对象动画为50%。问题是在click事件处理程序中找不到交集。
function mousedown( event )
{
event.preventDefault();
// update mouse object
mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
// find intersections
// create a reay with origin at the mouse position
// and direction into the scene (camera direction)
var vector = new THREE.Vector3( mouse.x, mouse.y, 1 );
var ray = projector.pickingRay( vector.clone(), camera );
//Check for intersections
var intersects = ray.intersectObjects( targetList , true);
// if there is one (or more) intersections
if ( intersects.length > 0 )
{
console.log(intersects);
//Start animating - animation is a global var in this scene triggering
//the animation.
animation = true;
}
else
{
console.log("No intersections");
}
}
这在首次实例化对象时有效。但是在对象被“动画化”之后它不起作用。经过一些调试后,我可以看到,即使在对象移动后(动画的前50%已经播放),对象的几何体的位置=(0,0,0)。
对于为什么mousedown事件没有拾取交叉点似乎是有意义的,因为在“世界”中,对象实际上并未定位在屏幕上的位置。
以下是加载对象的代码:
jsonLoader.load("assets/models/cheese01.js", function(geometry){
geometry.computeMorphNormals();
geometry.computeVertexNormals();
// geometry.computeBoundingSphere();
// geometry.normalsNeedUpdate = true;
// verticesNeedUpdate = true;
var material = new THREE.MeshLambertMaterial({
color: 0xaa1100,
morphTargets: true,
morphNormals: true,
wrapAround: true
});
var mesh = new THREE.MorphAnimMesh(geometry, material);
mesh.castShadow = true;
mesh.receiveShadow = true;
mesh.duration = 3000;
mesh.time = 0;
mesh.scale.set( 1, 1, 1 );
mesh.rotation.x = degToRad(175);
mesh.matrixAutoUpdate = false;
mesh.updateMatrix();
geometry.normalsNeedUpdate = true;
mesh.parseAnimations();
scene.add(mesh);
//Objects subject to intersection checks (from mouse click)
targetList.push(mesh);
//Objects to animate
morphs.push(mesh);
});
提前干杯以获得任何帮助!