Atölye › Frogger Tarzı Karşıya Geçiş › 7/22. adım
items bir şeritteki her arabanın şu an nerede olduğunu hesaplıyor: her spacing karede bir araba, şeridin
kayması (offset) kadar ötede, tekrar boyu (period) içinde başa sararak. Sonra her arabayı renkli bir kutu olarak
çiziyoruz.
```js
// Left edges (in tiles) of the cars or logs in a lane right now.
function items(lane) {
const p = period(lane)
const xs = []
for (let start = 0; start < p; start += lane.spacing) {
xs.push((((start + lane.offset) % p) + p) % p - lane.len)
}
return xs
}
for (const lane of LANES) {
ctx.fillStyle = lane.color
for (const x of items(lane)) {
ctx.fillRect(x * TILE + 2, TOP + lane.row * TILE + 6, lane.len * TILE - 4, TILE - 12)
}
}
```for (let start = 0; start < p; start += lane.spacing) → arabaların başlangıç yerleri: 0, spacing, 2 × spacing...start + lane.offset → şerit kaydıkça araba da kayar.((... % p) + p) % p → sayıyı 0 ile p arasına sardırır; eksi sayılarda da (JavaScript'in %'si eksi işareti
korur, + p ve yeniden % p bunu düzeltir).- lane.len → hepsini bir araba boyu sola kaydır: bir araba sol kenardan yarı dışarıda da görünebilsin.x * TILE + 2 ve lane.len * TILE - 4 → arabalar arasında küçük boşluk; + 6, TILE - 12 → satırın ortasında.period fonksiyonunun altına yorumu ve items fonksiyonunu yaz.draw içinde satır döngüsü ile kurbağa arasına şerit döngüsünü yaz.Beceriler: Diziler ve nesneler, Canvas üzerine çizim
← Trafik şeritleri Trafik akıyor →