Atölye › Pac-Man Tarzı Labirent Kovalamaca › 12/42. adım
Oyuncu artık yürüyor ama zıplayarak: 8 kare yerinde durup birden bir döşeme ileri atlıyor. Çünkü onu hep döşemesinin ortasına çiziyoruz.
Gerçek yeri: döşemesi artı adımın ne kadarının bittiği. 8 karelik adımın 4. karesindeyse yarım döşeme ileride.
position(e) bunu hesaplayacak; oyuncuyu oraya çizince akıcı kayacak.
```js
// Where an actor is drawn: its tile plus how far it has come towards the next one.
function position(e) {
return { x: e.col + (e.dir[0] * e.progress) / e.frames, y: e.row + (e.dir[1] * e.progress) / e.frames }
}
const p = position(player)
ctx.fillStyle = '#facc15'
ctx.beginPath()
ctx.arc(p.x * TILE + TILE / 2, TOP + p.y * TILE + TILE / 2, 10, 0, Math.PI * 2)
```(e.dir[0] * e.progress) / e.frames → adımın biten kısmı, yön kadar: sola giderken 4. karede -1 * 4 / 8 = -0.5.
O eksende hareket yoksa dir[0] 0'dır, sonuç da 0.x: e.col + ... → döşeme numarası artı biten kısım: 9 + (-0.5) = 8.5. Sonuç ondalıklı bir döşeme konumu.player.col yerine p.x, player.row yerine p.y: gerisi aynı hesap.// One frame of movement. ... yorum satırının üstüne yorumu ve position fonksiyonunu yaz; altında bir boş
satır kalsın.draw içinde oyuncunun ctx.fillStyle = '#facc15' satırının üstüne const p = position(player) yaz.ctx.arc(...) satırında player.col yerine p.x, player.row yerine p.y yaz.Beceriler: Canvas üzerine çizim
← Önceden basılan dönüşler Anında geri dön →