Three.js OrbitControls双击后锁定问题求助

首先明确：你遇到的not-allowed光标和控件卡住问题，本质是OrbitControls的默认双击行为与自定义复位逻辑冲突，加上复位过程中锁死控件限制导致的状态异常。以下是直接可行的解决方法：

1. 禁用OrbitControls默认双击行为 #

OrbitControls自带双击复位相机的逻辑，这会和你的自定义resetPosition抢状态，导致控件内部标记混乱。直接禁用默认双击处理：

this.controls = new OrbitControls(this.camera, this.element);
// 其他初始化配置...
// 覆盖默认双击处理函数，空实现即可
this.controls.handleDoubleClick = () => {};
// 或者通过事件阻止冒泡，保留自定义双击触发逻辑
this.element.addEventListener('dblclick', (e) => {
    e.stopPropagation(); // 不让OrbitControls捕获双击事件
    this.doReset = true; // 触发你的自定义复位
});

2. 修改复位逻辑，避免锁死控件限制 #

你当前的resetPosition通过强制设置minAzimuthAngle/maxAzimuthAngle等为同一个值，直接锁死了控件的可操作范围，这就是拖动时出现not-allowed光标的直接原因。改成直接平滑过渡相机位置和target，不要修改控件限制：

resetPosition() {
    const desiredTarget = CONTROLS_TARGET.clone();
    // 初始相机位置：target沿Z轴正方向偏移30单位（对应你原来的distance=30）
    const desiredCameraPos = desiredTarget.clone().add(new THREE.Vector3(0, 0, 30));
    
    const lerpDelta = LERP_ALPHA ** (1 + this.deltaTime * 60);
    
    // 平滑过渡相机位置和target
    this.camera.position.lerp(desiredCameraPos, 1 - lerpDelta);
    this.controls.target.lerp(desiredTarget, 1 - lerpDelta);
    
    // 判断是否到达目标位置，完成复位
    const posError = this.camera.position.distanceTo(desiredCameraPos);
    const targetError = this.controls.target.distanceTo(desiredTarget);
    if (posError < 0.01 && targetError < 0.01) {
        this.finishReset();
    }
}

finishReset() {
    this.doReset = false;
    // 这里不需要恢复min/max限制，因为根本没修改过
}

3. 手动重置光标状态（可选） #

如果偶尔还是出现光标异常，手动强制设置画布光标样式，确保和控件状态同步：

// 在animate循环或controls的change事件中更新光标
this.controls.addEventListener('change', () => {
    if (this.doReset) {
        this.element.style.cursor = 'default';
    } else {
        this.element.style.cursor = this.controls.isDragging ? 'grabbing' : 'grab';
    }
});

内容的提问来源于stack exchange，提问作者sandy