Building the Track

This example is the first step towards creating an actual track that objects can move along. I've combined the curve creation interface with a "physics engine". You can drag the points to create your curve, but now there's a ball (eventually this will be your cart/ship) that can be dropped onto the track. Click the "drop ball" button to generate the track from the points along your curve. You will see that the track, that was simply a visual representation up until this point, now exists and an "object in space" that other objects in the game world can be placed upon.

The sample file can be found here

NOTE: The ball ban be dragged, dropped and tossed. You will notice that the track behaves much like many platforms in classic (and new, I guess) games where the ball can pass through the bottom but cannot fall through the top.

"Resolution of the Curve"

I wanted to see how changing the xDelta would affect the smoothness of the curve. Although I don't know exactly how the levels will be generated, I'm certain that I will have to strike some balance between preserving the framerate of the game and how smooth the track will appear to the user. Obviously the more points used to define a curve, the smoother it will be. But with a higher "resolution" comes more data to update during gameplay. So I created this version of the previous example that shows the segments and allows you to input the xDelta. By changing the value in the bottom left I could begin to see what xDelta makes a smooth curve and what xDelta begins to look less like a curve and more like a bunch of line segments. You will notice that there's very little gained by going from 20 down to 10, but we have doubled the amount of data used to store this particular curve. This is good information to have. I'm still in the very high level planning phase, but it's important to at least have this type of thing in the back of my mind as I'm designing the game. NOTE: All of the nodes in this example are draggable.

Thank You Pixelwit!

In the process of concluding that I had to adjust the points along the curve that I was generating based on a magnitude, or ratio, of the relationship between on how close the anchor was to the endpoints of the curve, I stumbled upon Pixelwit's explanation on how Flash's curveTo() function works This filled in some of the math gaps in my brain and I was able to adjust my script based on his sample code. So thanks to Pixelwit for that! The result, available here, shows the points my script generates on top of Flash's curveTo() function. You can see that they're now behaving the same. The number of points along the curve is determined by what I'm referring to as my xDelta, or the minimum x distance between the points along the curve. This is not to be confused with the minimum length of the segments. There are still some kinks to work out before this can be ported over to a usable level editor (as is the ultimate goal of this interface) but this was a big step in the right direction.

More Parabola Tests

I went through a few more iterations of the first parabola test. Some using adjusted values and others including visual references to help me see how my curve behaved in different circumstances against the curveTo() function built into Flash.

• parabola test with curveTo overlay [2.22.08]


• another parabola test with curveTo overlay [2.22.08]


• parabloa test, adjusted values based on amplitude [2.22.08]

Parabola Test 01

This is an early test for creating a curve of points. My brother Ryan and I thought one approach might be to calculate two parabolas and fuse them together. After coding this, the fault in our logic, which we suspected, became apparent. The curve looked nice when the two parabola halves were similar, but as they approached their extremes the parabolas met at a sharp point and the smooth curve was lost. You can see the example here

Motion Along a Sine Wave

Here's a quick test to see how smoothly I could animate a movieClip along a sine wave generated entirely via actionScript. You can view the example here

Sine Wave

This shows how the Flash drawing API uses the curveTo() function to create a smooth curve at runtime. This is the curve I intend to recreate with code. The curve will be broken down into points and used to generate level data for Sinecart. See the example here