[CSS][JavaScript][HTML]Mapa w canvas'ie Opcje

[bartek10]

Witam, chciałbym stworzyć mapę do gry przeglądarkowej. Chodzi o wyrysowanie jakiejś fikuśnej mapy i rozmieszczenie na niej kropek, które będą oznaczały miasta. Po kliknięciu na nią przechodzi się do wybranego miasta. Czy istnieje jakiś sposób aby wyrysować taką mapę w elemencie canvas? Dodatkowo w bazie będą przechowywane współrzędne danych miast i chciałbym je odpowiednio wtedy nanieść na mapę przy pomocy wspomnianych współrzędnych. Samo wyrysowanie mapy nie powinno chyba sprawić problemów ale już wyznaczenie miejsc rozmieszczenia miast przy pomocy współrzędnych chyba tak.. Ogólnie nie za bardzo wiem jak się za to zabrać. Czy ktoś miałby dla mnie jakiegoś rodzaju wskazówki, pomysły etc.?

[PrinceOfPersia]

Po kliknięciu na nią przechodzi się do wybranego miasta. Czy istnieje jakiś sposób aby wyrysować taką mapę w elemencie canvas?

Jest sposób, tylko, że czysty Canvas "nie pamięta" obiektów, a jedynie przyjmuje komendy typu "rysuj obrazek", "rysuj kółko", "rysuj krzywą", "czyść ekran" etc. więc nie podczepiłbyś bezpośrednio zdarzenia onclick pod konkretne miasto, a jedynie pod cały Canvas, i byś musiał przeliczyć ręcznie współrzędne, żeby ustalić, które miasto było kliknięte.

i dlatego powstały biblioteki do Canvasa (EaselJS, KineticJS, FabricJS, PaperJS etc.), które stwarzają wygodną abstrakcję obiektową (pozwalają doczepić zdarzenie bezpośrednio do obrazka, czyli coś, czego byś nie zrobił na czystym canvasie).

mógłbyś też - łatwy sposób - zrezygnować w ogóle z Canvasa i robić to na divach z position:absolute, animując je za pomocą jQuery.

No i żeby się za to w ogóle zabrać, musiałbyś znać oczywiście jako tako język JavaScript, łącznie z obiektówką.

ale już wyznaczenie miejsc rozmieszczenia miast przy pomocy współrzędnych chyba tak..

dopóki mapa jest prostokątna, a jednostki są w pikselach jest to łatwe... gorzej jakby mapa była okrągła (w formie a la globus), a jednostki byłyby szerokością i długością geograficzną (ciężko przeliczyć na piksele).

Aha, no i zakładam, że tę mapę już masz jakoś, w formie bitmapy, albo coś.

Ten post edytował PrinceOfPersia 4.05.2013, 14:42:48