我正在寻找一种有效的互动方式 . 我基本上需要制作像谷歌地球风格设置,你可以:

围绕一个物体

  • 轨道,突出显示最中心位置,

  • 单击菜单链接并将对象的旋转设置为特定的'location'(突出显示新位置) .

我正在使用orbitcontrols作为第一位,并且希望直接在轨道控制中为菜单链接位补间,但是无法使摄像机在正确的路径中移动 . 所以我将相机放在一个物体内,当轨道控制器处理相机时,补间就完成了对象('camHolder') .

因此,有两个移动部件(由用户鼠标控制凸轮,camHolder通过链接点击补间到位),当任何一个移动时,它们之间的旋转差异会发生变化 . 为了突出显示这两个旋转值之间的正确“点”,我需要跟踪两者之间的偏移 . 基本上(codepen的简化版):

// -------  MOUSE/CAMERA INTERACTION ---------

// location of points (in radians):
   var pointLongs=[-3,-2,-2.5,-2,-1.5,-1,-0.5,0,1,2,2.5,3];

// most recent point highlighted (by menu click):
   var currentPoint = 5; 

// get diff (in radians) between camera and current point
   var pointDistance = pointLongs[currentPoint] - camera.rotation.y;

// the offset rotation of cam (i.e. whats closest to the front):
   var offset = camera.rotation.y + pointDistance;

// find the closest value to offset in pointLongs array:
   var closest = pointLongs.reduce(function (prev, curr) {
     return (Math.abs(curr - offset) < Math.abs(prev - offset ) ? curr : prev);
   });
   closestPointIndex = pointLongs.indexOf(closest);

// highlight that point (raise it up):
   scene.getObjectByName(pointNames[closestPointIndex]).position.y = 20;

只要pointDistance大于0,这似乎就有效,但如果没有,当前'点'的跟踪仅适用于鼠标轨道圆的一部分,当它应该一直工作时 .

Codepen在这里:http://codepen.io/anon/pen/BNPWya(唯一的补间代码嵌入在那里,所以跳过第一个块...) . 尝试用鼠标旋转形状,并注意到这些点不会发生变化......有时它会一直发生变化!

我已经尝试改变所有的值(pointLongs所有正值;相机的初始旋转等)但我的数学通常很糟糕,而且我已经失去了直接观察的能力 - 任何人都有任何想法?请问一下是否有意义!

我添加了标签'HelpMeWestLangleyYoureMyOnlyHope',但我没有足够的声誉:D

TLDR;物体和相机的旋转赢了't ' sync',需要纠正差异,还是找到一种方法来补偿轨道控制的位置/旋转?