Dont understand Bezier-curves

I have read this article https://developer.roblox.com/en-us/articles/Bezier-curves but I still dont understand it please can someone give me an example?

1 Like

Are you looking for an understanding on how it works or the math behind it? (or both)

And have you used the search bar as well?

Here is an extremely simplified explanation on how it works:

  • Two points always mark the beginning or end in the bezier curves, the other points serve as where to bend the curve(s) towards.

Bezier curves are pretty simple and useful, most notably used for tweening. Here I will try to explain how they work and the math behind it.

The basis of bezier curves is linear interpolation. Say you have two points in space and drew a line between them, you can get any point along that line with linear interpolation. So, linear interpolation is used to obtain a point on a line between a discrete set of points. With linear interpolation, we use a number between 0 and 1, which also can be considered a percentage, called an alpha, which is represented by a or sometimes t.

The formula used for linear interpolation (commonly called lerp) is:

function lerp(p0, p1, t)
    return (1 - t) * p0 + t * p1
end

local a = Vector3.new()
local b = Vector3.new(10, 0, 0)

print( lerp(a, b, 0.5) ) -- (5, 0, 0)
print( lerp(a, b, 0.75) ) -- (7.5, 0, 0)


Although it’s not really a curve, this is considered a linear bezier curve


Now the more complex bezier curves come in: We can have 3 points (a, b, c) in the world. We can interpolate between a and b with a specified alpha t, and do the same for b and c with the same alpha. If you interpolate between the result from the interpolation between a and b and the result from the interpolation between b and c, you’ll get a curve like this:

This is called a quadratic bezier curve and with quadratic bezier curves and other curves with higher order have 2 end points (p0 and p(n-1), where n is the number of points), while the other points are control points. The control points are used to determine how the curve will bend

This is easily solved using recursion (of the linear interpolation function):

local function quadratic(p0, p1, p2, t)
    local L1 = lerp(p0, p1, t)
    local L2 = lerp(p1, p2, t)
    return lerp(L1, L2, t)
end

Expanding this for an explicit calculation as a function, you’ll get:

Q(t) = (1 - t)[(1 - t) * p0] + t * p1] + t[(1 - t) * p1 + t * p2]

Now for another specifically named curved with a set amount of points: the cubic bezier curve. A cubic bezier curve has 2 end points (p0 and p3) and 2 control points (p1 and p2).

Back at it again with recursion:

local function cubic(p0, p1, p2, p3, t)
    local L1 = lerp(p0, p1, t)
    local L2 = lerp(p1, p2, t)
    local L3 = lerp(p2, p3, t)
    local Q1 = lerp(L1, L2, t)
    local Q2 = lerp(L2, L3, t)
    return lerp(Q1, Q2, t)
end

The Q's in the function stand for quadratic, meaning that you’re also creating a quadratic curve to make a cubic curve, so a shorter way of doing the above is creating two quadratic curves with p0, p1 and p2, then with p1, p2 and p3 respectively:

local function cubic(p0, p1, p2, p3, t)
    local Q1 = quadratic(p0, p1, p2, t)
    local Q2 = quadratic(p1, p2, p3, t)
    return lerp(Q1, Q2, t)
end

Expanding the above for an explicit calculation as a function, you’ll get:

C(t) = (1 – t)^3 * P0 + 3(1 – t) ^ 2 * t * P1 + 3(1 – t) * t^2 * P2 + t ^ 3 * P3

A cubic bezier curve looks like this:

In reality, you can create bezier curves with as many points as you want, with only a few being specifically named (i.e: linear, quadratic and cubic). Naming higher-order bezier curves (bezier curves with over 4 points) are usually named as (n as an ordinal number)-order curves where n is the amount of points, e.g: sixth-order curves, where there are 6 points.

Hopefully this’ll help you understand.

Resources:

10 Likes

This really helped :smile:! And I’m not even the one who needed help lol

(late reply)