Hlavní navigace

Mapový server snadno a rychle (6)

15. 12. 2005
Doba čtení: 3 minuty

Sdílet

V minulém díle jsme si vytvořili první šablonu, s jejíž pomocí jsme vygenerovali první HTML stránku. Dnes do ní budeme přidávat ovládací prvky jako legendu nebo referenční mapu.

Přidáváme ovládací prvky

Mapové vrstvy

Pro ovládání naší aplikace budeme nyní přidávat další formulářové prvky. Začneme přidáním ovládání pro to, jaké vrstvy se vlastně mají zobrazovat a jaké ne. Jako všechno ostatní i vrstvy se ovládají pomocí políček formuláře:

[...]
<td>
    <!-- vrstvy -->
    <input name="layer" value="modis" type="checkbox" [modis_check]>Družicový snímek<br>
    <input name="layer" value="staty_plochy" type="checkbox" [staty_plochy_check]>Plochy států<br>
    <input name="layer" value="staty_hranice" type="checkbox" [staty_hranice_check]>Hranice států<br>

    <!-- /vrstvy -->
</td>
<td>
    <!-- obrázek s mapou -->
    <input type="image" name="img" src="[img]" width="400" height="300" border="0">
    <!-- /obrázek s mapou -->
</td>

[...] 

Ještě změňte status vrstvy modis na OFF a můžete reloadnout stránku.

Legenda

Máme dvě možnosti, jak vytvořit legendu: buď jako obrázek nebo pomocí HTML.

Obrázek

Obrázek je snazší možnost, ale výsledek není moc hezký. Vyrobí se prostě tak, že se do šablony vloží následující obrázek.

<img name="legend" src="[legend]"> 

a do mapfilu přidáme objekt LEGEND (třeba za  WEB):

# Legenda
LEGEND
    KEYSIZE 12 12
    LABEL
      TYPE BITMAP
      SIZE MEDIUM
      COLOR 0 0 89
    END
    STATUS ON
END 

HTML legenda

HTML legenda je podle mého vkusu lepší, můžeme ji formátovat například pomocí CSS spolu se zbytkem stránky. Výroba je o něco málo komplikovanější: musíme pro ni vyrobit šablonu. Do mapfilu, do objektu LEGEND, musíme vložit ještě jeden řádek:

# Legenda
LEGEND
    KEYSIZE 12 12
    STATUS ON
    LABEL
      TYPE BITMAP
      SIZE MEDIUM
      COLOR 0 0 89
    END
    TEMPLATE "/var/mapservdata/tmpls/legenda.html"
END 

A dále musíme tento soubor vytvořit.

[leg_class_html]
<tr>
  <td>
      <img src="[leg_icon width=20 height=10]" width=20 height=10>
  </td>
  <td>

      [leg_class_name]
  </td>
</tr>
[/leg_class_html] 

Do HTML šablony vložíme další klíčové slovo:

<!-- /vrstvy -->
<!-- legenda -->
<hr>

<table border=0 name="legend">
    [legend]
</table>
<!-- /legenda --> 

Nyní stačí už jen reloadovat stránku a legenda bude generována automaticky.

Referenční mapa

Malá mapička s vyobrazenou aktuální oblastí je nezbytnou součástí každé aplikace. Uživateli poskytuje přehled a může sloužit jako rychlá navigace po území. Pro její přidání musíme nejdříve přidat patřičné řádky do mapfilu a pak patřičné řádky do HTML šablony. Před vlastní editací mapfilu a šablony potřebujeme vytvořit obrázek referenční mapky a potřebujeme znát její hraniční souřadnice. Obrázek uložme do adresáře /var/mapservdata/tmpls/ a nazvěme jej refmap.png. Hraniční souřadnice této mapy převezmeme z celkového území. Patřičná část mapfilu by měla vypadat následovně:

REFERENCE
    IMAGE '/var/mapservdata/tmpls/refmap.png' # Obrázek s referenční mapou
    EXTENT 208398.01 -372335.44 1285308.08 632638.93 # hraniční souřadnice v projekci US Nat. Atl.
    STATUS ON #
    MINBOXSIZE 10 # Minimální velikost rámečku znázorňující aktuální oblast
    MAXBOXSIZE 150 # Maximální velikost rámečku znázorňující aktuální oblast
    COLOR -1 -1 -1 # Barva výplně rámečku -- nyní průhledná
    OUTLINECOLOR 0 255 0 # Barva rámečku
    MARKERSIZE 8 # Velikost značky, která se objeví po dosažení "MINBOXSIZE"
    MARKER 'cross' # Symbol, kterým bude zobrazen
END 

Do HTML šablony pak doplníme následující:

[...]
<!-- referenční mapa -->
<img name="ref" src="[ref]">
<hr>
<!-- /referenční mapa -->
<!-- vrstvy -->
[...] 

A aby toho nebylo málo, musíme si ještě napsat, jak má takový MARKER 'cross' vypadat. Do mapfilu vložíme ještě:

UX DAy - tip 2

SYMBOL
  NAME "cross"
  TYPE vector
  POINTS
    2 0
    2 4
    -99 -99
    0 2
    4 2
  END
END 

Definice symbolů může být uložena i v samostatném souboru (což je mimochodem více než vhodné, máte-li více než 5 symbolů…). Nyní již vše vypadá, jak má.

Většina potřebných věcí je již na svém místě, příště budeme pokračovat.

Byl pro vás článek přínosný?