Take the 2-minute tour ×
Game Development Stack Exchange is a question and answer site for professional and independent game developers. It's 100% free, no registration required.

I would like to draw a land for a motocross game. I've been thinking of Bezier Curves but I am not sure whether this is the best approach. Can you give me some advice? I want to do it in JavaScript, not very good choice but it's personal project so for time being it's OK.

share|improve this question
1  
Why are you saying JavaScript is a bad choice? Sure for a AAA it would be a bad choice, but for a simple online game, it is a good choice. –  AttackingHobo Oct 31 '10 at 17:25
add comment

2 Answers

up vote 2 down vote accepted

I found a couple of links that might be useful for others:

Example script of Bezier implementation in JS
http://jsfromhell.com/math/bezier

It can be used from JavaScript or ActionScript to animate along a bezier path.
http://code.google.com/p/javascript-beziers/

Online drawing script/plot, quite useful if you want to make some tests
http://jsdraw2d.jsfiction.com/demo/curvesbezier.htm

A bit of theory and an implementation example
http://13thparallel.com/archive/bezier-curves/

share|improve this answer
add comment

Instead of beziers, you probably want b-splines or catmull-rom splines.

float bspline(float t, float p0, float p1, float p2, float p3)
{
  float it = 1.0f - t;

  float b0 = it*it*it * (1.0f / 6.0f);
  float b1 = (3*t*t*t - 6*t*t +4) * (1.0f / 6.0f);
  float b2 = (-3*t*t*t +3*t*t + 3*t + 1) * (1.0f / 6.0f);
  float b3 =  t*t*t * (1.0f / 6.0f);

  return     
    b0*p0 +
    b1*p1 +
    b2*p2 +
    b3*p3;
}

float catmullrom(float t, float p0, float p1, float p2, float p3)
{
  return 0.5f * (
          (2 * p1) +
          (-p0 + p2) * t +
          (2 * p0 - 5 * p1 + 4 * p2 - p3) * t * t +
          (-p0 + 3 * p1 - 3 * p2 + p3) * t * t * t
          );
}

Usage: t ranges from 0 to 1, where the value interpolates the spline between two control points, and the floats p0, p1, p2 and p3 are represent the control points (previous, current, next, and the following). To interpolate n-dimensional curves, just call the functions once per axis.

The practical difference between bsplines and catmull-rom is basically that catmull-rom goes through all control points while bsplines are more smooth.

share|improve this answer
    
Question about the bspline formula. What is the purpose of float it = 1.0f - t and using it for the b0 value? Why do that for the bspline, and not the catmull rom? –  canderson Oct 13 '11 at 20:25
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.