You are Here:Home>>Old Posts>>Tutorial | Away3D PathExtrude: Cords & Ribbons

Tutorial | Away3D PathExtrude: Cords & Ribbons

By | 2008-06-16T23:46:17+00:00 Jun 16, 2008|Old Posts|

path2

Right after the Mirror class, A new addition to the Away3D library: The PathExtrude class.
The PathExtrude class projects any profile defined by Number3D’s on a given Path. Capital P to Path, because it’s also a new comer to the library. (This one will do much more later on…)

This class allows you to generate phone cords, cable, handwrited letters, ribbons, race tracks, handles etc… in just a few lines and like all the others: no third party 3d app required.

However if you play a bit with it, you’ll soon realize you’ll need to find/write a generator for the path information, doing it by hand would be very tedious if the path is extended. But for anyone that have already traced curve using the Flash API, will know exactly what I mean.

The demo’s are speaking for themselves… here just a few examples with some code.

The first thing is to define a profile:

Then declare a Path instance, and define the CurveSegments
import away3d.animators.data.Path;

The order of the array is v0, va (anchor), v1. You would do the same to define a curve in Flash (curveTo()).
note: the null is there to save the typing since it’s the v1 from previous CurveSegment.

You can define the world axis as well, needed for the directional vector to align properly your profile.
default is 0,1,0. Depending on the profile orientation, you might need to set it.

You then just pass it all this to the class

Done!

path4

There is a cool addon too, you can influence the Path CurveSegments by passing a series of Number3D’s for the scale of the profile along the path at each points. By default it’s being smoothed from startscale to endscale per segment, if you set the property smoothscale to false, it will equally scale the whole segment.
This is especially handy when it comes to build complex shapes like a bike frame, a thea cup handle or even a spoon…

The scales array is applied one by one on following same indexes as the Path CurveSegments, so you can pass less scale modifiers than path segments. For instance if you would want to affect only the beginning of the mesh generation.

Here we pass the scales array this time.

path5

Same code with some scale changes, this time we set the smoothscale property to false.
As you can see the scale changes are only set to the segments. No matter how high the subdivision is.

path5

In this example, we pass only the profile, and set it on the path but we do not pass scales modifiers and the property alignToPath is set to false. The profile is set on the path but no directional rotation is done. And you get a nice ribbon.I’ve set the bothsides property to flase so you can see how nice the curve is.

path1

Here another variation, this time the middle object is a straight path, and I pass a star like profile. This is something you would not be able to do with the Lathe class. You could do it with the Skin class. But if i would want to bend the shape, then this class only would give you the right shape.

The path generated for the second object has now an extrude as “ribbon”: the align to path is set to false.

path6

I could make tons of demos since almost each output generates an interesting shape, so one last example. Same path as the first demos, except this time I pass a circle like profile. And what do we get here? A nice cord!

This class is in the Away3D trunk. I can wait see what you guys will do with this one!

About the Author

Fabrice Closier is a Flash Developer, and belongs to the Away3D team. He run’s also a blog where you can view more tips and tutorials about this awesome Flash 3D Engine.

About the Author:

A father, a husband and a geek... Biitlog Founder, The Tech Labs founder, among other projects.

One Comment

  1. Robert August 15, 2008 at 3:22 pm - Reply

    No doubt that you show fascinating stuff! But considering the fact that it is a tutorial, I have to critisize its incompletness. Being new to Away3D I just can’t tell why you don’t mention to import pathExtrude while you mention to import the animators.data.path.

    Also, you nowhere explain what “mat” is supposed to be.

    I think you also should post the complete source code!

    As I said before: those who are more familiar with Away3D already, will find their ways. But noobies wil just get stuck.

    Please get more into detail or at least post the complete source code!

    Thanks!
    Robert

Leave a Reply