You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何用THREE.OrbitControls实现平面绕Z轴及X轴旋转

Three.js OrbitControls 适配俯视地形场景的问题

我创建了覆盖X、Y轴、法向量为Z轴的PlaneGeometry网格(用作地形/等高线图),相机初始位于平面正上方,从+Z轴向下俯视。默认情况下OrbitControls围绕X、Y轴旋转的操作逻辑,在这个场景里实用性很低。

目前我通过scene.rotateX(-Math.PI/2)旋转场景,再调整相机到Z轴上方,此时OrbitControls可实现:垂直拖动鼠标俯视/仰视平面,水平拖动让平面绕Z轴旋转切换视角,但还有两个问题需要解决:

  • 是否有API可以直接将OrbitControls设置为围绕Z轴操作?(场景旋转后视图仰角为0,平视平面,我需要把相机调整到Z轴上方的高空位置)
  • 有没有无需旋转场景、保持相机初始位置,就能让OrbitControls指定旋转轴的方法?

补充代码:

const camera = new THREE.PerspectiveCamera( 60, w/h, 0.1, 100 );
camera.position.set(0, 0, 50);
camera.up.set(0, 0, 1);   // <=== 绕Z轴旋转
const ob_controls = new THREE.OrbitControls(camera, canvas);

内容的提问来源于stack exchange,提问作者Jack Punt

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.11 12:35:20