[PHP][HTML][JS]Rysowanie mapy do gry przeglądarkowej Opcje

[ChaYim]

Witam.
Postanowiłem stworzyć prostą grę przeglądarkową w celach rozwojowych.
HTML i CSS jest dla mnie jasny, w PHP mogę się ocenić na tróję minus... Trochę gorzej z MySQL oraz JS. Przy tym ostatnim języku moje ogarnianie sprowadza się bardziej do analizy kodu i logicznego rozkładania go na czynniki pierwsze, niż wykorzystywanie wyuczonych i sprawdzonych rozwiązań. Tyle słowem wstępu.

Staram się stworzyć grę, w której gracz będzie miał m.in. możliwosć założenia grupy/klanu/gildii na danym kawałku mapy.

Stworzyłem tabelę, w której mam współrzędne od 1x1 do 64x64 czyli łącznie 4096 lokacji.

Struktura tabeli:

Kod

x - INT
y - INT
grupa - INT
background - VARCHAR (255)

Gdzie x i y to współrzędne, grupa - id grupy, do której należy lokacja; background - przyszła klasa html, która będzie miała przypisane tło.

W tej chwili mam kod, który wyświetla wszystkie lokacje jako <span> z odpowiednim obrazkiem w tle. Problem jednak w tym, że nie jest to wogóle zoptymalizowane i nie raz zawiesil mi sie localhost...

Zdaję sobie sprawę, że istnieje coś takiego jak canvas, z tym, że moja wiedza o nim kończy się wlaśnie tutaj.

Ogólne założenia mapy są takie:
- Wyświetla 10x10 w jednym obrazie, z wyśrodkowaniem na lokacji gracza (przypisanej do niego w bazie)
- Możliwość oddalania, przybliżania i przesuwania.

Jak radzicie? Od czego zacząć, z której strony ugryźć?