Desenhe terreno para o jogo de motocross

7

Eu gostaria de desenhar um terreno para um jogo de motocross. Estive pensando nas curvas de Bezier, mas não tenho certeza se essa é a melhor abordagem. Voçê pode me dar algum conselho? Eu quero fazer isso em JavaScript, não é uma escolha muito boa, mas é um projeto pessoal. Por enquanto, não há problema.

infinidade
fonte
11
Por que você está dizendo que o JavaScript é uma má escolha? Claro que para um AAA seria uma má escolha, mas para um simples jogo online, é uma boa escolha.
AttackingHobo

Respostas:

4

Em vez de beziers, você provavelmente deseja splines b-splines ou catmull-rom.

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
          );
}

Uso: t varia de 0 a 1, onde o valor interpola o spline entre dois pontos de controle e os flutuadores p0, p1, p2 e p3 representam os pontos de controle (anterior, atual, próximo e a seguir). Para interpolar curvas n-dimensionais, basta chamar as funções uma vez por eixo.

A diferença prática entre bsplines e catmull-rom é basicamente que o catmull-rom passa por todos os pontos de controle enquanto os bsplines são mais suaves.

Jari Komppa
fonte
Pergunta sobre a fórmula bspline. Qual é o propósito float it = 1.0f - te o uso itdo b0valor? Por que fazer isso para o bspline, e não para a rom?
Chrismanderson
2

Encontrei alguns links que podem ser úteis para outras pessoas:

Exemplo de script da implementação de Bezier em JS
http://jsfromhell.com/math/bezier

Pode ser usado no JavaScript ou no ActionScript para animar ao longo de um caminho mais bezier.
http://code.google.com/p/javascript-beziers/

Script / trama de desenho online, bastante útil se você quiser fazer alguns testes
http://jsdraw2d.jsfiction.com/demo/curvesbezier.htm

Um pouco de teoria e um exemplo de implementação
http://13thparallel.com/archive/bezier-curves/

infinidade
fonte