如何在Three.js OrbitControls中设置相机极角与方位角以定位GPS坐标？

我来帮你搞定这个需求！其实OrbitControls虽然没有暴露setPolarAngle或setAzimuthAngle方法，但你可以直接修改它的公开属性，再触发更新就能实现相机定位到指定GPS坐标的效果。下面是具体步骤和代码示例：

第一步：理解经纬度与OrbitControls角度的对应关系 #

首先要把GPS的**纬度（latitude）和经度（longitude）**转换成OrbitControls使用的弧度制角度：

• 极角（polarAngle）：从Y轴正方向（地球北极）向下测量的角度，范围是0到π弧度。转换公式：极角 = (90° - 纬度) * π / 180°。比如纬度90°（北极）对应极角0，纬度0°（赤道）对应π/2，纬度-90°（南极）对应π。
• 方位角（azimuthAngle）：绕Y轴旋转的角度，范围是0到2π弧度。转换公式：方位角 = (经度 + 180°) * π / 180°。这个转换会把经度-180°对应方位角0，经度0°对应π，经度180°对应2π，刚好匹配OrbitControls的默认坐标系。

第二步：直接设置OrbitControls的角度属性 #

OrbitControls的polarAngle和azimuthAngle是公开可写的属性，你可以直接赋值，然后调用controls.update()让控件重新计算相机位置。

代码示例 #

假设你要定位到北纬30°，东经120°的位置：

// 定义目标GPS坐标（纬度：30°N，经度：120°E）
const targetLat = 30;
const targetLng = 120;

// 转换为弧度并计算对应的极角和方位角
const polarAngle = (90 - targetLat) * Math.PI / 180;
const azimuthAngle = (targetLng + 180) * Math.PI / 180;

// 直接设置OrbitControls的角度
controls.polarAngle = polarAngle;
controls.azimuthAngle = azimuthAngle;

// 锁定相机距离（可选，保持相机到地球的固定距离）
const cameraDistance = 5; // 假设地球半径为1，这里设置相机距离地球中心5个单位
controls.minDistance = cameraDistance;
controls.maxDistance = cameraDistance;

// 更新控件，让相机位置生效
controls.update();

第三步：调整细节适配你的模型 #

• 如果你的地球纹理的0°经度（本初子午线）不是默认的X轴正方向，可能需要给方位角加上一个偏移量，比如azimuthAngle = (targetLng + 180 + offset) * Math.PI / 180，确保纹理和坐标对应正确。
• 记得确保polarAngle的取值在0到π之间，避免出现相机穿模或异常视角的问题。

这样操作后，相机就会自动定位到你指定的GPS坐标对应的3D位置啦！

内容的提问来源于stack exchange，提问作者Théo Champion