Three.js - 选择/取消选择的对象答案

【问题标题】：Three.js - Selected/Deselected objectThree.js - 选择/取消选择的对象
【发布时间】：2015-10-21 23:28:40
【问题描述】：

在我的 three.js 场景中，我可以添加和编辑对象。我最近添加了一个 DAT.GUI 文件夹，我可以在其中编辑对象颜色。但是当没有任何 SELECTED 对象时，我用 jQuery 隐藏它：

function onDocumentMouseDown(event){
    event.preventDefault();
    mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
    mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
    raycaster.setFromCamera(mouse, camera);
    var intersects = raycaster.intersectObjects(objects);
    if(intersects.length > 0){
        SELECTED = intersects[ 0 ].object;

        control.attach(SELECTED);
        scene.add(control);
        $(guiObject.domElement).attr("hidden", false);
    } else{
        control.detach(SELECTED);
        scene.remove(control);
        control.update();
        $(guiObject.domElement).attr("hidden", true);
    }
}

但问题是，当我单击该按钮时，它会消失，因为如果用户单击对象以外的其他位置，我希望该对象被取消选择。

有什么解决办法？

【问题讨论】：

标签： javascript three.js selected

【解决方案1】：

感谢Falk，问题解决了。

我不得不改变我的功能：

function onDocumentMouseDown(event){
    event.preventDefault();
    if($(event.target).is('canvas')){
        mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
        mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
        raycaster.setFromCamera(mouse, camera);
        var intersects = raycaster.intersectObjects(objects);
        if(intersects.length > 0){
            SELECTED = intersects[ 0 ].object;

            control.attach(SELECTED);
            scene.add(control);
            $(guiObject.domElement).attr("hidden", false);
            // SELECTED.material.color.setHex( Math.random() * 0xffffff );
        } else{
            control.detach(SELECTED);
            scene.remove(control);
            control.update();
            $(guiObject.domElement).attr("hidden", true);
        }
    } else{
        $(guiObject.domElement).attr("hidden", false);
    }
}

【讨论】：