[PHP]Mapa jak w plemionach Opcje

[MnicH.]

Witam,
ostatnio mnie zaciekawiło jak zrobić mapkę na styl tej która jest w grze plemiona.
Wpadłem na pomysł.
Użyć w HTMLu <MAP>, ale w map area wyświetla tylko odnośnik. I mam pytanie jak zrobić żeby był wyświetlany obrazek np budynku.
mapa ma np rozmiary 500x500, jeden budynek to np 50x50. mapa podzielona jest na 10 pól w pionie i poziomie:
(IMG:http://i36.tinypic.com/2mxex3o.png)
Czyli jeśli user ma budynek na pozycji 4:3 to powinien pojawić się budynek
(IMG:http://i35.tinypic.com/35n34hx.png)
1 kratka to 50x50px.

Mam coś takiego:

[PHP] pobierz, plaintext 
<?php
$cityX = '0'; //pozycja gorna (kratka)
$cityY = '0'; //pozycja boczna (kratka)
 
 
$a = $cityX*50;
$b = $cityY*50;
$c = $a+50;
$d = $b+50;
 
echo '<img src="tlo.png" width="500" height="500" alt="mapa" title="mapa" usemap="#mapa">
<map name="mapa" id="mapa">
<area shape="rect" alt="a" title="a" coords="'.$a.', '.$b.', '.$c.', '.$d.'" href="#">
</map>';
 
?>
[PHP] pobierz, plaintext 

I jak zrobić żeby wyświetlało budynek a nie odnośnik?

Może macie inne pomysły jak to wykonać?

[thek]

Jest to zrobione identycznie jak w google maps. Masz kwadraty o odpowiedniej wielkości ułożone obok siebie przesuwanie to tylko zwracanie do serwera pozycji środka, która to sprawdza jakie "kwadraty" są widoczne i w razie czego dosyła kolejne bądź aktualizuje ich wygląd jeśli zaszły zmiany. Szczerze mówiąc budynk czy cokolwiek może być jak marker, czyli ma wyświetlanie na dowolnej współrzędnej. Zapewne jednak nawet to jest uproszczone w dużym stopniu. Pewnie masz duży świat i każdy kwadrat jest numerowany, a funkcja wstawia akurat te widoczne. Do tego jeśli na jakimś znajduje się budynek czy cokolwiek, to owo pole zostaje ujęte jako klikalny link.A że te są jako inline to nie robi to żadnej różnicy. To po prostu w takim wypadku dużo znaczników img z padding 0, margin 0, float left i paroma innymi wpisami w css, a gdzieniegdzie img jest objęte przez A, co ostatecznie tworzy zgrabną mapkę z klikalnymi linkami. Można więc ująć, że jest to:

[HTML] pobierz, plaintext 
<div id='mapka'>
<img src="/mapa/105.jpg" />
<img src="/mapa/106.jpg" />
<img src="/mapa/107.jpg" />
<img src="/mapa/108.jpg" />
<img src="/mapa/109.jpg" />
<img src="/mapa/110.jpg" />
<img src="/mapa/205.jpg" />
<a href="karczma.php" title="Karczma"><img src="/mapa/karczma.jpg" /></a>
<img src="/mapa/207.jpg" />
<img src="/mapa/208.jpg" />
<img src="/mapa/209.jpg" />
<img src="/mapa/210.jpg" />
</div>
[HTML] pobierz, plaintext 

Jako że budynki są zawsze w tym samym miejscu to nawet nie trzeba przezroczystego img na innego nakładać. Wystarczy tam gotowca wstawć, bo zgra się z resztą. reszta to tylko ostylowanie. ważne by całość została tak dobrana, by div zawierający fragmenty miał odpowiednią szerokość, która pozwala na swobodne przepłynięcie elementów img wewnątrz i wtedy nie trzeba się o nic martwić. samo się stawi wszystko.

Ten post edytował thek 19.10.2009, 19:22:41