Atölye › Pinball › 25/42. adım
Paletin ekseni sabit; peki öbür ucu, ucu (tip) nerede? Eksenden, açının gösterdiği yönde FLIPPER_LENGTH
kadar ötede. Bir saatin yelkovanı gibi: merkez sabit, ucun yeri açıya göre değişir.
Bir açıyı "ne kadar sağa, ne kadar aşağı"ya çeviren iki matematik fonksiyonu var: kosinüs ve sinüs. Ucu bulan küçük bir fonksiyon yazıp paletleri eksenden uca kalın mavi çizgiler olarak çizeceğiz.
```js
const tip = (f) => ({ x: f.x + Math.cos(f.angle) * FLIPPER_LENGTH, y: f.y + Math.sin(f.angle) * FLIPPER_LENGTH })
ctx.strokeStyle = '#38bdf8'
ctx.lineWidth = 10
for (const f of flippers) {
const t = tip(f)
ctx.beginPath()
ctx.moveTo(f.x, f.y)
ctx.lineTo(t.x, t.y)
ctx.stroke()
}
```Math.cos(açı) → o yönde 1 piksel gidersen ne kadar sağa gidersin (sola ise eksi).Math.sin(açı) → aynı adımda ne kadar aşağı gidersin (yukarı ise eksi).0 ise cos 1, sin 0: tam sağ. Açı Math.PI ise cos -1, sin 0: tam sol.* FLIPPER_LENGTH → 1 piksellik adımı paletin boyuna büyütür; f.x + ve f.y + eksenden başlatır.const tip = (f) => ({ ... }) → bir ok fonksiyonu bir sabite konmuş: tip(palet) diye çağrılır ve ucun
yerini { x, y } nesnesi olarak döndürür. function tip(f) { return { ... } } ile aynı iş, daha kısa.for (const f of flippers) → her palet için ucu bul, eksenden uca 10 piksel kalınlığında mavi çizgi çek.// Push the ball out of a segment... yorum satırının üstüne tip satırını yaz; altında bir boş satır kalsın.draw içinde tamponları çizen forEach bloğunun kapanan }) satırının altına paletleri çizen satırları yaz.Beceriler: Canvas üzerine çizim, Fonksiyonlar
← İki palet Paletler topu durdurur →