AEJoy —— 随机运动表达式之球面上的随机运动（四）【JS】

效果图

原理与代码

现在我们已经掌握了产生随机运动的技巧，让我们做一些有趣的事情。

我们的目标是看看我们是否能在球面上创造随机运动。我们会看到，通过一些几何学，一些三角学和我们的随机运动算法，我们可以解决一些看似不可能的问题。

首先让我们看一看几何学和涉及的三角函数。还不算太糟。真的。

在球坐标系中，位置由到原点([0,0,0])的距离(r)(表示半径)、从一个轴的角度(我们将使用 z 轴)(我们将称其为 phi)和绕该轴的旋转角度(我们将称其为 theta)来确定。

检查一下这个图:

如果你熟悉三角函数，上面的图应该给了你所有的信息，你需要弄清楚如何将半径和两个角度转换为 x,y,z 坐标。

看一看代码:

r = 50; //radius of sphere
segMin = 2; //minimum segment duration
segMax = 4; //maximum segment duration

end = 0;
j = 0;
while ( time >= end){
  j += 1;
  seedRandom(j,true);
  start = end;
  end += random(segMin,segMax);
}
endTheta =  random(0,Math.PI*2);
endPhi = random(0,Math.PI);
seedRandom(j-1,true);
dummy = random(); //this is a throw-away value
startTheta =  random(0,Math.PI*2);
startPhi = random(0,Math.PI);
theta = ease(time,start,end,startTheta,endTheta);
phi = ease(time,start,end,startPhi,endPhi);
sinPhi = Math.sin(phi);
x = r*Math.cos(theta)*sinPhi;
y = r*Math.sin(theta)*sinPhi;
z = r*Math.cos(phi);
center = thisComp.layer("center").position;
center + [x,y,z]

这实际上是球面上一点的公式和我们的随机运动表达式的结合。

为了让星星始终面对球体中心的空对象，你只需给每个星星添加这个方向表达式:

lookAt(position,thisComp.layer("center").position)

为了增加一点趣味性，我将随机旋转表达式添加到每颗星星的 z 旋转属性中:

segMin = .3; //minimum segment duration
segMax = .7; //maximum segment duration
minVal = -180;
maxVal = 180;

end = 0;
j = 0;
while ( time >= end){
  j += 1;
  seedRandom(j,true);
  start = end;
  end += random(segMin,segMax);
}
endVal =  random(minVal,maxVal);
seedRandom(j-1,true);
dummy=random(); //this is a throw-away value
startVal =  random(minVal,maxVal);
ease(time,start,end,startVal,endVal)

就是这样——通过对随机运动表达式的适度改变，我们已经在一个球面上生成了 3D 运动。