Language agnostic 寻找点的角度以产生机械波效果

这只是为了好玩

我想知道在相应的圆中旋转的每个点的角度的公式

以下是我的给定值：

• 行数
• 列数
• 圆的半径（通用）

这就是我想要实现的画面：

我假设每个点的旋转速度是一致的

更新：

耶！谢谢你的回答。然而，我也设法以不同的方式制作了自己的：

通过仅在构造函数端执行逻辑：

CircleWithDots() : timer(clock()), angle(angle_counter = (angle_counter >= REVOLUTION - 1) ? 0 : angle_counter + ANGLE_STEP) { }

其中：

REVOLUTION = 360 + 1;
ANGLE_STEP = 20;

还有这个（旋转点）：

---

就像我在评论中说的，这只是对角线的排列，所以你所要做的就是

(xpos-ypos)*scale_factor

这是一个正在处理的js画板（速度有点慢，您只需将其复制粘贴到本地处理安装中，即可看到它运行得更快）：

有关部分是：

        ang = (x-y) * scalefac + anim;
        float xpos = x*xscale+ sin(ang)*cwidth/2.0;
        float ypos = y*yscale+ cos(ang)*cheight/2.0;
        arc(xpos,ypos,4,4,0,PI*2);

如果有人想要一个可平铺的版本，这里是：

真是一场爆炸！ 事实证明，这是一个相当简单的练习。有几个步骤和一个重要的认识

首先，我注意到在水平行中，每个循环有16个圆圈，与y轴相似。在我看来，猜测水平相邻点之间的角度步长与垂直相邻点之间的角度步长相同是合理的。因此，如果圆0,0处于0度，则圆0,1将处于（360/（16+1））度，圆1,0也将处于（360/（16+1））度。（注意：我在源代码中使用了360/16）

我只是为每列和每行增加圆原点的位置。A还可以增加每列和每行的角度偏移。使用偏移使我能够使每个点的位置与行/列中其他点的位置不同，同时也使我能够通过增加它来逐步完成动画

下面是一个运行示例：

代码的重要部分是绘制每个帧的函数。两个圆绘制功能都以圆的中心点为准

function drawFrame(angleOffset)
{
    var can = byId('dest');
    var ctx = can.getContext('2d');
    var x, y, xStep, yStep;
    ctx.clearRect(0,0,can.width,can.height);

    for (yStep=0; yStep<21; yStep++)
    {
        angle = yStep * (360 / 16);
        angle += angleOffset;

        y = yStep * 460/20 + 0.5;
        for (xStep=0; xStep<21; xStep++)
        {
            x = xStep * 460/20 + 0.5;
            drawCircle(x,y, 21, ctx);

            var pos = calcPos(angle, 21);
            pos.x += x;
            pos.y += y;
            fillCircle(pos.x,pos.y,3,ctx,'red');
            angle += (360 / 16);
        }
    }
}

功能画框（角度偏移）
{
var can=byId（'dest'）；
var ctx=can.getContext（'2d'）；
变量x，y，xStep，yStep；
ctx.clearRect（0,0，罐宽，罐高）；
对于（yStep=0；yStep任何一对点[I，J]的相对运动的一个可能方程为

AngularPosition[I, J] = SquareRoot((-X[I] + X[J])^2 + (-Y[J] + Y[J])^2)

在哪里

在哪里
X
是数组中的水平位置
Y
是数组中的垂直位置
t
是时间，
K
是点的恒定旋转速度，
和
H
，
V
是相邻圆之间的相位差，水平和垂直（这里可能是H=V）
它认为角度本身可以通过2
sin
（或
sin
和
cos
）的组合获得函数，每个函数的输入将是row和colum@thumbmunkeys我只是通过截图（不移动）想出了一个主意随着行数和列数的增加，角度仅比上一个角度大。HMI认为，如果只添加
x
，最终将得到一个Z字形图案，而不是平滑的曲线，它将使用
sin
，其中输入仅为行（标准化为[0,1]范围），我想你会得到一个水平波，它们成对角线排列，所以像
（xpos-ypos）*比例因子
应该足够了。非常好。虽然看起来有点不对劲，但问题中的圆点旋转也在向后。干杯。我猜眼睛疲劳。：）这是一个简单的反转从calcPos返回的y坐标的问题。也就是说，在屏幕空间中向下增加y，而trig函数有+y向上。谢谢你指出。哇！这看起来几乎和我发布的GIF一样。干得好：D
AngularPosition[I, J] = SquareRoot((-X[I] + X[J])^2 + (-Y[J] + Y[J])^2)

VectorPosition[I, J] = (-X[I] + X[J], -Y[J] + Y[J])

-X[I] + X[J] = sin(K*t + PhaseDiffXofDots[I, J])

-Y[I] + Y[J] = cos(K*t + PhaseDiffYofDots[I, J])

{ Or it could be same, sin or cos in both X and Y directions }


PhaseDiffXofDots[I, J] = (-(circle[I]CenterX + (circle[J]CenterX))*H

PhaseDiffYofDots[I, J] = (-(circle[I]CenterY + (circle[J]CenterY))*V