Atölye › XOX › 9/33. adım
Dizide kutular 0'dan 8'e numaralı. Ama çizmek için kutunun ortasının piksel olarak yerini bilmemiz lazım. Sinemada koltuk numarasından sıra ve koltuğu bulmak gibi: iki küçük formül numarayı sütun ve satıra çevirir.
0 1 2 sütun = numara % 3
3 4 5 satır = Math.floor(numara / 3)
6 7 8
Bu adımda 7 numaralı kutuya X yazacağız.
```js
const index = 7
const x = (index % 3) * CELL + CELL / 2
const y = Math.floor(index / 3) * CELL + CELL / 2
ctx.fillText('X', x, y)
```const index = 7 → hangi kutu: 7 numara.index % 3 → % bölümden kalan demek: 7'nin içinde iki tane 3 var, 1 artar. Yani 7 numara 1. sütunda
(sütunlar da 0'dan sayılır: 0, 1, 2).Math.floor(index / 3) → / bölme: 7 / 3 = 2.33... Math.floor(...) sonucu aşağı yuvarlar (küsuratı atar):
2. Yani 7 numara 2. satırda (en alt satır).* CELL → sütunu/satırı piksele çevirir: 1 × 100 = 100, 2 × 100 = 200. Bu, kutunun sol üst köşesi.+ CELL / 2 → yarım kutu (50) ekleyip kutunun ortasına geçer: x = 150, y = 250. Parantez içi önce hesaplanır,
sonra çarpma ve bölme, en son toplama; matematikteki gibi.ctx.fillText('X', x, y) → X'i o noktaya yazar.draw içindeki ctx.fillText('X', 50, 50) satırını sil.Beceriler: Diziler ve nesneler
← Bir X yaz Tahtada ne varsa çiz →