Three.js - 變換控件

Question

我正在使用 transformControls 來平移、旋轉和縮放我的對象。 我希望能夠點擊場景中的不同對象並隨時變換它們：它有效！ 唯一的問題是幾何圖形的可點擊區域向上移動了一半：

也就是說，我無法在下方區域單擊時選擇我的對象，但是如果我單擊上方，它將被選中。

對於 collada 文件，情況更糟。

我認為它應該在這里的某個地方：

function onDocumentTouchStart(event){
    event.preventDefault();
    event.clientX = event.touches[0].clientX;
    event.clientY = event.touches[0].clientY;
    onDocumentMouseDown(event);
}
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;
        scene.add(control);
        control.attach(SELECTED);
    } else{
        scene.remove(control);
    }
}

編輯 ：

天啊...問題是這里的一些邊距...

但是現在，我的初學者問題是我真的不知道如何將 transformControls 附加到我的對象。 使用transformControls，我仍然有問題。 但是當我點擊改變材質顏色時，它工作得很好。 有 transformControls 某種邊距？ 我這樣做了：

if(intersects.length > 0){
            SELECTED = intersects[ 0 ].object;
            scene.add(control);
            control.attach(SELECTED);
        } else{
            scene.remove(control);
        }

Answer 1

答案很明顯...：

    if(intersects.length > 0){
    SELECTED = intersects[ 0 ].object;

    control.attach(SELECTED);
    scene.add(control);

} else{
    control.detach(SELECTED);
    scene.remove(control);
}

我忘記分離控件

Answer 2

sRcBh 的回答基本正確，但是代碼有錯誤。 TransformControls的detach方法不接受任何參數。

if (intersects.length > 0) {
    SELECTED = intersects[ 0 ].object;
    control.attach(SELECTED);
    scene.add(control);
} else {
    control.detach(); // <- THIS IS CORRECT
    scene.remove(control);
}

（參見https://threejs.org/docs/#examples/en/controls/TransformControls ）