Raycaster - 如何移动我点击的网格

Question

我试图点击一个对象，这是一个网格。例如，如果我点击苹果，我希望苹果在特定坐标中移动。现在，我现在将clickedObject设置为apple。

document.addEventListener('mousedown', onDocumentMouseDown, false);

var objects = new Array();
objects.push(apple, orange, banana);
var clickedObject;

function onDocumentMouseDown(event) {
    var mouse_x = ( event.clientX / window.innerWidth ) * 2 - 1;
    var mouse_y = -( event.clientY / window.innerHeight ) * 2 + 1;
    var vector = new THREE.Vector3(mouse_x, mouse_y, 0.5);
    vector.unproject(camera);
    var raycaster = new THREE.Raycaster(camera.position,
            vector.sub(camera.position).normalize());

    console.log("on mouse down event handler");
    var intersects = raycaster.intersectObjects( objects );
    if (intersects.length > 0) {

        // the first one is the object we'll be moving around
        clickedObject = intersects[0].object;
        // and calculate the offset
        var intersects = raycaster.intersectObject(referencePlane);
        if(clickedObject === apple) {
            var tween2 = new TWEEN.Tween(apple.position)
                    .to({ x: 0}, 100)
                    .start();
            animate();
        }
        if(clickedObject === orange) {
            var tween2 = new TWEEN.Tween(orange.position)
                    .to({ x: 0}, 100)
                    .start();
            animate();
        }
        if(clickedObject === banana) {
            var tween2 = new TWEEN.Tween(banana.position)
                    .to({ x: 0}, 100)
                    .start();
            animate();
        }
    }
}

这很有效。但是，当我点击橙色网格时，它也会激活“橙色”。我这样做了吗？我想动画所有对象（不是同时），具体取决于我是否点击该特定对象。