3D bezier?

[AmiAction]

Hello everyone,

does anyone knows how to draw 3D Bezier in actionscript 3 flash 10?
Any sample code around?

thank you
Best regards

[rawmantick]

Check out http://en.wikipedia.org/wiki/B%C3%A9zier_curve

In Quadratic Bézier curves you can see the equation, which gives the function of B(t) out of 3 points Pi. In examples given the number of dimensions is 2. However this equation is universal and works for any number of dimensions.

See, you have 3 points in 3D space. P1, P2 and P3. All you need is to iterate the t parameter from 0 to 1 and get the bezier curve point for each value.

[AmiAction]

Thank you.

I will investigate further.

[lordofduct]

bezier curves are "recursive linear interpolations"

a bezier curve of N degrees is solved in SUM { N-1, k=0} ( k ) interpolations between points. (that is it occurs in the number of steps defined as the summation of each integer from 0 to N-1 degrees).

For example... a 3rd degree bezier consists of 3 points (of any dimension, 1D, 2D, 3D, 4D, ND). Let's call these points a, b, and c. And we want to find the position t (a value from 0->1) on the curve defined by a, b, and c

you first interpolate between a and b by t... and b and c by t. Resulting in points a2 and b2

a2 = (b - a) * t + a
b2 = (c - b) * t + b

now you interpolate between all of the new points (which makes several line segments). You keep doing this recursively until you are left with one point.

a3 = (b2 - a2) * t + a2

a3 is now your point...

note we did 3 interpolations... that is 2 + 1. If it was a 4th degree bezier we'd do in 3 + 2 + 1 = 6 interpolations:

a, b, c, d

a2 = (b - a) * t + a
b2 = (c - b) * t + b
c2 = (d - c) * t + c

a3 = (b2 - a2) * t + a2
b3 = (c2 - b2) * t + b2

a4 = (b3 - a3) * t + a3

only have one left, a4 is the result.

you can see a geometric representation of this recursive linear interpolation on that wiki page in the images there... like this:






Now yes, there are TONS of algebraic and triginometric equations for solving bezier curves of different degrees. But depending the degree the equation changes. There are also some linear algebraic formulae as well that treat all degrees and dimensions of curves. The linear algebra formulae tend to be very complex and hard for none math nerd to solve. And the algebraic and trig formulae are just to strict and don't expand well with varying degrees of curves and changing dimensions.

Where as this algorithm I just outlined is straight forward and simple. It works for any number of dimensions and all degrees of bezier curves. It's really that simple.


Here is a simple 3D example using Vector3D from flash cs4:

//pass any number of Vector3D objects in an array to be resolved
//the length of the array bez will be the degree of the bezier
function getPointOnBezier( bez:Array, t:Number ):Vector3D
{
    if(bez.length < 1) return null;
    if(bez.length == 1) return bez[0].clone() as Vector3D;

    var a1:Array = bez.slice();
    var a2:Array = new Array();

    while(a1.length > 1)
    {
        while(a1.length > 1)
        {
            var p1:Vector3D = a1.shift() as Vector3D;
            var p2:Vector3D = a1[0] as Vector3D;
            var p3:Vector3D = new Vector3D( (p2.x - p1.x) * t + p1.x, (p2.y - p1.y) * t + p1.y, (p2.z - p1.z) * t + p1.z );
            a2.push(p3);
        }
        a1 = a2.splice(0,a2.length);
    }
    return a1[0] as Vector3D;
}

this algorithm does not shoot for arithmetic efficiency. As the degree of the bezier curve increases, the amount of loops increases by degree - 1. But should run rather swiftly for degrees that are very low.

What this algorithm shoots for is simplicity, elegance, and being dynamic. From an analytical point of view it's very interesting, and the proof for which is fun. Any of the algebraic algorithms are really just a static equation stuck to any specific degree... the analysation for which is boring and could be proved in one line. No fun in my opinion...