Atölye › Bilardo › 2/33. adım
Bilardo masası kahverengi bir çerçevenin (bantlar) içinde yeşil bir dikdörtgendir (çuha). Çuhanın dört kenarını
adlandırıyoruz: LEFT, TOP, RIGHT, BOTTOM. Toplar bu kenarların arasında yuvarlanacak ve bantlara çarpacak;
her şeyi bu dört sayıya göre ölçeceğiz.
```js
const LEFT = 20
const TOP = 40
const RIGHT = 460
const BOTTOM = 280
ctx.fillStyle = '#78350f'
ctx.fillRect(LEFT - 12, TOP - 12, RIGHT - LEFT + 24, BOTTOM - TOP + 24)
ctx.fillStyle = '#15803d'
ctx.fillRect(LEFT, TOP, RIGHT - LEFT, BOTTOM - TOP)
```LEFT = 20, RIGHT = 460 → çuhanın sol ve sağ kenarının x'i; TOP = 40, BOTTOM = 280 → üst ve alt kenarın y'si.ctx.fillRect(LEFT - 12, TOP - 12, RIGHT - LEFT + 24, BOTTOM - TOP + 24) → bantlar: çuhadan her yönde 12 piksel büyük
kahverengi bir dikdörtgen. Sol üst köşesi 12 piksel dışarıda, eni ve boyu 2 × 12 = 24 fazla.ctx.fillRect(LEFT, TOP, RIGHT - LEFT, BOTTOM - TOP) → çuha: sol üst köşesi (LEFT, TOP), eni RIGHT - LEFT = 440,
boyu BOTTOM - TOP = 240. Bantlardan sonra çizildiği için onların üstüne gelir; kahverengiden geriye yalnız 12
piksellik bir çerçeve kalır.const ctx = ... satırının altına bir boş satır bırak ve dört kenarı yaz.draw içinde arka planı boyayan fillRect satırının altına dört satırı yaz.Beceriler: Canvas üzerine çizim