Sin波线从x1,y1到x2,y2

Question

示例图片:

我希望能够从一个点到另一个点绘制线条,就像上图中所示的线条一样,但我不知道该如何去做.

我正在使用GML,但如果你给我任何其他代码,那么我很可能能够理解它.

Answer 1

尽管看起来像是一个正弦波,但这实际上是一个立方贝塞尔曲线.维基百科的文章经过数学,并在这里是通过应该是相当简单的实现行走的文章.假设您通常像在UE4蓝图中一样水平绘制线条,我会将控制点放置在水平中点,并且与每个控制点的端点处于相同的y级别,从而创建"阶梯"形状:

p0 .  .  .  p1 .  .  .  .
.  .  .  .  .  .  .  .  .
.  .  .  .  p2 .  .  .  p3

首先,您需要创建一个可以计算给定曲线上的点的函数.这是文章中的C#实现:

Vector3 CalculateBezierPoint(float t,
  Vector3 p0, Vector3 p1, Vector3 p2, Vector3 p3)
{
    float u = 1 – t;
    float tt = t*t;
    float uu = u*u;
    float uuu = uu * u;
    float ttt = tt * t;

    Vector3 p = uuu * p0; //first term
    p += 3 * uu * t * p1; //second term
    p += 3 * u * tt * p2; //third term
    p += ttt * p3; //fourth term

    return p;
}

您可以将Vector3更改为2D Vector2结构,或者将其分解为x/y值并调整数学以进行补偿(道歉,自从我使用GML以来已经过去了大约十年,所以我不确定是什么类型的您必须使用的数据结构).

既然您有办法计算曲线上的点,您可以编写一个函数来绘制它.绘制它而没有任何丢失像素的最简单方法是绘制一系列线段.同样,这是文章中的C#实现:

q0 = CalculateBezierPoint(0, p0, p1, p2, p3);

for(int i = 1; i <= SEGMENT_COUNT; i++)
{
    t = i / (float) SEGMENT_COUNT;
    q1 = CalculateBezierPoint(t, p0, p1, p2, p3);
    DrawLine(q0, q1);
    q0 = q1;
}

有更好的方法,但这应该让你开始,并为你进一步搜索提供一些词汇.干杯!