Stránka 1 z 1

Klikací mapa - snadno a rychle

Napsal: 15 lis 2015 11:05
od Falt
Rozhodl jsem se přidat na webové stránky také mapku, ze které by bylo možné se kliknutím dostat na nějakou další stránku s popisem, diagramem a pod. Říká se tomu "klikací mapa". Bližší vysvětlení co je "klikací mapa" je na webu, např. http://www.jakdelatweby.cz/html/mapy.php

Funkci Klikací mapa obrázku má zabudovanou TNG pro fotografie (s odkazem na stránku osoby pod ukazovátkem myši) - funguje výborně.

Klikací mapa je jednoduchá, pouze může být v praxi potíž s určením souřadnic. Rozhodl jsem se proto zaměřit se na postup, u kterého bude možné souřadnice spolehlivě zapsat jak pro tvary obdélníku, tak kruhu nebo mnohoúhelníku. Narazil jsem na free prográmek Handy Imape Mapper. Je ke stažení na odkazu http://www.softpedia.com/get/Internet/WEB-Design/Menu-Creators/Handy-Image-Mapper.shtml Pro stažení si zvolte nabídku Softpedia Mirror (US) a stahování začne automaticky během několika vteřin.

V zásadě udělá všechny choulostivé operace za mne. Postup s Handy Imape Mapper:

1. Načíst obrázek, ve kterém potřebuji vytvořit klikací mapu
2. Zvolit si tvary, jejichž souřadnice budou zapsány jako odkaz na další stránku - např. obdélník (pracnější je mnohoúhelník)
Handy_Imape_Mapper.png
Ukázka práce s Handy Imape Mapper
Handy_Imape_Mapper.png (72.27 KiB) Zobrazeno 9707 x

3. Vpravo nahoře si zvolím tvar, jehož souřadnice chci zapsat - v příkladu obdélník a tyto hodnoty se automaticky promítnou do pole Vertexes.
4. V poli Tooltip zapíši alternativní název pro oblast
5. V poli HREF mohu zapsat URL adresu (anebo dodatečně při ladění)
6. V poli Map name mohu změnit nabízený název, pod kterým se klikací mapa zapíše do HTML souboru.
7. Závěrečným krokem je stisk klávesy vpravo dole Place On Clipboard. Tím se celý kód pro klikací mapu zapíše do schránky a lze jej kopírovat do finálního souboru.
Závěr: Pokud nepracujete denně s kódem HTML, může Handy Imape Mapper být dobrý tip, jak vytvořit klikací mapu na první pokus dobře a rychle.
:shock: