将球体旋转到特定点。不是相机

Question

我需要一些帮助。

我有搜索，找不到解决方案，因为所有的解决方案都是围绕球体旋转摄像头。

在我的情况下，相机仍然是。我有一个围绕纬度和经度使用点的webgl地球仪。我只想点击一个点并旋转全球网格，以使其位于该点的中心。

我有点Vector3，它的经度和纬度，但我不知道如何做到这一点。

是否有人可以帮助我？或者知道这样的例子吗？

预先感谢您

Answer 1

要旋转的球体来匹配经/纬度相机中心，你可以这样做：

var verticalOffset = 0.1; 
sphere.rotation.x = latitude * (Math.PI/180) - verticalOffset; 
sphere.rotation.y = (270 - longitude) * (Math.PI/180); 

，那么你可以用吐温称之为：

var tween = new TWEEN.Tween(sphere.rotation) 
    .to({ x: latitude * (Math.PI/180) - verticalOffset, y: (270 - longitude) * (Math.PI/180) }, 2000) 
    .start(); 

我创建了一个展示的jsfiddle此，其中一个标志设置在里斯本：

http://jsfiddle.net/L0rdzbej/208/

---

更新

如果球已经转身了很多，在Y旋转值爬起。然后，如上所述补间旋转会导致大量反转，直到该点显示在相机中心。

为了避免这种情况，可以通过四元数设置旋转。补间必须用时间四元数来表示。 为了演示的目的，我将球体初始Y旋转设置为PI * 12.1，然后应用四元数。

http://jsfiddle.net/L0rdzbej/217/

var phi = latitude * Math.PI/180; 
var theta = (270 - longitude) * Math.PI/180; 
var euler = new THREE.Euler(phi, theta, 0, 'XYZ'); 

// rotation (using slerp) 
var qstart = new THREE.Quaternion().copy(sphere.quaternion); // src quaternion 
var qend = new THREE.Quaternion().setFromEuler(euler); //dst quaternion 
var qtemp = new THREE.Quaternion(); 

var o = {t: 0}; 
new TWEEN.Tween(o).to({t: 1}, 2500) 
     .onUpdate(function() { 
     THREE.Quaternion.slerp(qstart, qend, qtemp, o.t); 
     sphere.quaternion.copy(qtemp); 
     }) 
     .start();