Atölye › Wolfenstein Tarzı 3B Labirent › 13/18. adım

Işık ve gölge

Ne yapıyoruz

Bütün duvarlar aynı gri; köşeler kayboluyor. Her duvar türü kendi rengini alsın; üst/alt yüzünden vurulan duvarlar biraz koyu olsun ve her şey uzaklıkla sönükleşsin. Labirentin katı görünmesi için bu kadarı yeter.

```js
const COLORS = { '#': [148, 163, 184], 2: [185, 90, 60], E: [34, 197, 94] }

function shade(hit, dist) {
  // Walls facing north or south are a little darker, and everything fades with distance.
  const light = (hit.side === 'y' ? 0.7 : 1) * Math.max(0.25, 1 - dist / 12)
  const [r, g, b] = COLORS[hit.tile]
  return 'rgb(' + Math.round(r * light) + ', ' + Math.round(g * light) + ', ' + Math.round(b * light) + ')'
}

    ctx.fillStyle = shade(hit, dist)
```

Ne işe yarıyor

Sıra sende

  1. FOV satırının üstüne COLORS yaz.
  2. draw fonksiyonunun üstüne shade fonksiyonunu yaz.
  3. Sütun döngüsünde '#94a3b8' yerine shade(hit, dist) yaz. Çalıştır.

Beceriler: Canvas üzerine çizim

Tüm adımlar

  1. Harita
  2. Oyuncu
  3. Tavan, zemin ve döngü
  4. Dön
  5. Yürü
  6. Duvar mı?
  7. Duvarda dur, boyunca kay
  8. Işın: nereden başlıyor
  9. Işın: ızgara çizgileri
  10. Işın: duvara kadar yürü
  11. 3B görünüm
  12. Balık gözü yok
  13. Işık ve gölge
  14. Süre
  15. Kaçış!
  16. En iyi süre
  17. Dokunmatik kontrol
  18. Kendin yap: koş