Atölye › OutRun Tarzı Yarış › 25/44. adım

Yolu kıvır

Ne yapıyoruz

Eski yarış oyunlarının en akıllıca hilesi: yol aslında hiç kıvrılmıyor. Çizerken her parçayı bir öncekinden biraz daha fazla yana kaydırıyoruz:

Bir örnek: curve 2 ise kaymalar 0, 2, 6, 12, 20... diye gider. Her seferinde artan bir miktar eklemek düzgün bir eğri (parabol) çizer; göz bunu uzaklaşırken kıvrılan bir yol olarak görür. Düzlükte curve 0: kayma artmaz.

```js
// Work out where every segment is on screen, from near to far, bending the road a little more at each curve.
const base = Math.floor(position / SEG)
let x = 0
let dx = 0
const shown = []
for (let i = 0; i < DRAW; i++) {
  const index = (base + i) % segments.length
  const z = (base + i) * SEG - position
  const near = project(x - playerX * ROAD, -CAMERA_HEIGHT, z)
  const far = project(x + dx - playerX * ROAD, -CAMERA_HEIGHT, z + SEG)
  x += dx
  dx += segments[index].curve
  if (z > 0) shown.push({ index, near, far })
}
```

Ne işe yarıyor

Sıra sende

  1. // Work out where ... yorumunun sonuna , bending the road a little more at each curve ekle (yorum, zorunlu değil).
  2. base satırının altına let x = 0 ve let dx = 0 yaz.
  3. near satırında -playerX * ROAD'un önüne x yaz: x - playerX * ROAD. far satırında x + dx - playerX * ROAD yap.
  4. far satırının altına x += dx ve dx += segments[index].curve satırlarını yaz.
  5. Çalıştır, hızlan: ileride yolun kıvrıldığını görmelisin.

Beceriler: Hız ve yerçekimi, Canvas üzerine çizim

Tüm adımlar

  1. Gökyüzü ve zemin
  2. Tekrar tekrar çiz
  3. Perspektif
  4. Bir parça yol
  5. Parçalardan bir yol
  6. Pistte neredeyiz?
  7. Öndeki yol
  8. Şeritler
  9. Uzaktan yakına boya
  10. Bordür ve orta çizgi
  11. Şeritli çimen
  12. Hareket tek bir sayı
  13. Hangi tuşlar basılı?
  14. Gaz pedalı
  15. Fren, boşta gitme ve azami hız
  16. Senin araban
  17. Hız göstergesi
  18. Telefon için pedal
  19. Kamerayı yana kaydır
  20. Direksiyon
  21. Duran araba dönmez
  22. Çimen yavaşlatır
  23. Dokunarak direksiyon
  24. Virajlı bir pist
  25. Yolu kıvır
  26. Virajda sıçrama olmasın
  27. Hangi parçadayım?
  28. Viraj dışarı çeker
  29. Rakip arabalar
  30. Döngüde uzaklık
  31. Uzaklaştıkça küçülen arabalar
  32. Trafik akıyor
  33. Arkadan çarpma
  34. Turları say
  35. Turu göster
  36. Tur süresi
  37. Süreyi göster
  38. En iyi tur
  39. En iyi turu göster
  40. Yarışıyor mu, bitti mi?
  41. Bitiş çizgisi
  42. Bitti!
  43. Yeniden yarış
  44. Kendin yap: saate karşı