Движение трижды - перемещение по кругу за фиксированный период времени

Question

Я пытаюсь заставить объект двигаться по круговой траектории за фиксированный период времени.

Применение это часы с плавным движением.

Таким образом, вместо того, чтобы постоянно менять положение на фиксированную координату .getSeconds(), я хочу использовать комбинацию (.getSeconds() + (.getMilliseconds()/1000), чтобы точно представлять движение секундной стрелки в любое время.

Для делать круговые движения в прошлом я использовал следующую пару функций:

var OrbitCalculationX = function(velocityPartial, orbitalRadius) { 
     return (Math.sin(Date.now()/16000 * velocityPartial) * orbitalRadius); 
    }; 
    var OrbitCalculationZ = function(velocityPartial, orbitalRadius) { 
     return (Math.cos(Date.now()/16000 * velocityPartial) * orbitalRadius); 
    };` 

16000 в этом расчете контролируемого орбитальное время. Однако это неверно. Есть ли способ управлять набором уравнений x-axis sin vs z-axis cos, который имеет точные временные ограничения?

Если нет, существует ли способ установить путь анимации для завершения в течение определенного периода времени в THREEjs?

Answer 1

Я надеюсь, что я вас понял правильно здесь ...

Возьмите одну минуту, которая имеет 60 секунд и 60000 мсек. Итак, первый шаг, который мы хотим, - это иметь номера в этом диапазоне.

var millisInMinute = Date.now() % 60000; 

Следующая вещь, которую мы хотим, чтобы нормализовать значения, так что она идет от 0 до 1:

var millisInMinuteNormalized = millisInMinute/60000; 

Теперь, чтобы сделать весь круговое движение с грехом и соз, где мы знаем, что наш переменная будет находиться в диапазоне от 0 до 1, нам нужно умножить его на 2 * PI see plot here

остальные с радиусом, как вы это сделали, в результате чего

var orbitCalculation = function(radius) { 
    return {x: (Math.sin((Date.now()%60000)/60000 * Math.PI * 2) * radius), 
      z: (Math.cos((Date.now()%60000)/60000 * Math.PI * 2) * radius)}; 
} 

Фактические секунды отображаются правильно, вы можете сравнить их с системным временем. Вот working JSFiddle