javascript - Threejs 基于相机旋转的指南针

Question

我想制作一个像 Facebook 上的那样的指南针: Click here for image

FOV(罗盘中间的饼图)将根据相机的 FOV 旋转。我有相机的 x、y 和 z 旋转，但我想知道如何将其转换为 2d 圆形 View ？此外，three.js 相机的 y 旋转仅从 -PI/2 到 PI/2

非常感谢任何帮助:)

Answer 1

使用 THREE.Spherical() 解决了同样的问题

var vector = new THREE.Vector3();
var center = new THREE.Vector3();
var spherical = new THREE.Spherical();
vector.copy( camera.position ).sub( center );
spherical.setFromVector3( vector );
var rot = spherical.theta;
$('#compassSVG > svg')[0].style.transform = 'rotate('+ rot +'rad)';