Tarkvara kaart-kujutiste loomiseks.

Kaart-kujutise loomine nõuab kahe sammu läbimist:

1. Kaart-kujutise aluskujutise ettevalmistamine, millel järgnevalt määratletakse aktiivsed alad..
2. Aktiivsete alade geomeetrilisi parameetreid iseloomustava konfiguratsioonifaili koostamine.

Aluskujutise ettevalmistamine ei erine tavalisest HTML koodi sisestavate kujutiste ettevalmistamisest, selleks võib kasutada suvalist graafilist redaktorit või siis kasutada juba valmisolevaid kujutisi.

Konfiguratsioonifaili koostamiseks on vajalik määratleda aktiivsed alad kujutisel ja seada neile vastavusse viidete URL aadressid. Konfiguratsioonifaili ettevalmistamine osutub kõige raskemaks sammuks kaart-kujutiste loomisel. Põhimõtteliselt on olemas moodus, kus aktiivsete alade piirid kujutisel antakse ette käsitsi: eelmises tunnis kasutasime selleks programmi Paint, kus me märkisime üles üksikud punktid ja panime kirja nendele vastavad koordinaadid ning sisestasime saadud arvud aktiivsete alade geomeetrilisi parameetreid kirjeldavasse teeki <MAP>. Ent selline lähenemine on üldisel juhul liiga ebamugav ja kohmakas.

Selleks, et automatiseerida aktiivsete alade määratlemist kujutisel on olemas rida programme, millest suurem osa on väga sarnased. Nad võimaldavad luua ja muuta konfiguratsioonifaile, töötades vahetult kujutisega kuval. Suurem osa programmidest kujutab endast autonoomseid utiliite, mis töötavad iseseisvalt ja on sisuliselt lisaks HTML redaktoritele. Need programmid võimaldavad salvestada loodava konfiguratsioonifaili kas Windowsi puhvermälus või siis failina kettal. Esimesel juhul on tüüpiliseks koostöö kaart-kujutise redigeerimise programmi ja mingi HTML redaktoriga (või tavalise tekstiredaktoriga). Kui aga programm võimaldab salvestada konfiguratsioonifaili kettal, siis võib teda kasutada täiesti autonoomselt. Kõik sellised programmid võimaldavad määratleda kujutisel kolme põhitüüpi geomeetrilisi figuure: rect, circle ja poly. Mõned redaktorid toetavad ka tüüpi default. Ainsaks kriteeriumiks kaart-kujutiste redigeerimise programmi valikul on tema kasutamise mugavus, kuna oma funktsionaalsete omaduste poolest on kõik programmid väga lähedal teineteisele. Kui programmi kasutajaliides tundub Teile ebamugavana, siis on alati võimalus valida mõni teine programm.

Programm Map Edit.

Üheks kõige lihtsamaks ja populaarsemaks konfiguratsioonifailide redigeerimise programmiks on utiliit Map Edit, mille on loonud Thomas Boutell ja mis on olemas juba mitu aastat ning on realiseeritud mitmele platvormile nagu Windows 3.x, Windows 95/98/NT. nagu ka enamuse programmide jaoks on olemas ka selle utiliidi mitmed erinevad versioonid. Viimane teadaolev versioon Windows 95/98/NT jaoks on 2.6 (september 1999). Lisainformatsiooni programmi kohta võib saada aadressil: http://www.boutell.com/mapedit/.

Programm on oma mahult küllaltki väike - distributiiv hõivab kõigest umbes 300 kilobaiti ja omab seejuures praktiliselt kõiki vajalikke omadusi.

Ülesanne 1. Programmi Map Edit allalaadimine ja installeerimine.

1. Klõpsake sellel viitel (map32dst.exe) hiire parempoolset klahvi ja valige avanenud kontekstmenüüst korraldus Save Target As….
2. Käivitage installeerimiseks allalaaditud distributiiv.
3. Käivitage programm.

Programm võimaldab redigeerida konfiguratsioonifaile nii server-variandi jaoks (formaadid NCSA ja CERN) kui ka klient-variandi jaoks. On olemas visuaalne võimalus aktiivete alade määratlemiseks ringide, ristkülikute ja hulknurkade kujul. Samuti on võimalus määratleda viite aadressi vaikimisi aktiivsele alale.

Peale programmi käivitamist ilmub kuvale Map Edit põhiaken, mida näete ka joonisel, milles on näidis ja menüüriba. On olemas võimalus redigeerida olemasolevaid kaart-kujutise konfiguratsioonifaile nii server-variandi kui ka klient-variandi jaoks. On olemas võimalus luua ka uus konfiguratsioonifail, ent see puudutab vaid server-varianti. Klient-variandi korral peab juba olemas olema HTML dokument, milles on olemas viited sisestatud kujutistele, millest saavad kaart-kujutiste loomise aluskujutised.

Ülesanne 2. Valmistame ette HTML dokumendi ja salvestame selle uue nimega.

1. Avage kaustast "HTML40" programmi Notepad abil dokument "kaart-kujutis.htm".
   
   
2. Salvestage nüüd dokument "kaart-kujutis.htm" kausta "HTML40" uue nimega (File - Save As…): "mapedit.htm".
   
   
3. Kustutage kujutise teegist <IMG> parameeter:
   
   USEMAP=#grafmeny
   
   
4. Kustutage nüüd ka konteiner teek <MAP> koos kõigega, mis on selle sees.
   
   
5. Salvestage nüüd muudatused dokumendis "mapedit.htm" ja sulgege Notepad.
   
   
6. Avage dokument "mapedit.htm" lehitseja abil.
   
   Nagu te isegi veenduda võite on "kadunud" kõik viited kaart-kujutiselt.
   Alles on vaid alternatiivne navigatsioonivahend: tekstiviidetest koosnev menüü.

Ülesanne 3. Loome aktiivsete alade kirjelduse programmi Map Edit abiga.

1. Avage dokument "mapedit.htm" valides punktist File korralduse Open HTML Document…
   
   
2. Peale algdokumendi avamist väljastab Map Edit dialoogiakna, milles on näidatud kõik selles dokumendis olevate sisseehitatud kujutiste nimetused. Klõpsake vajalikul (antud juhul ainsal) kujutise nimetusel ja seejärel klõpsake ka korraldusnupul OK.
   
   
3. Programmi aknas avatakse meile juba tuttav kujutis "grafmeny.gif".
   
   
4. Klõpsame nüüd tööriistaribal asuval rohelise ruuduga nupul Add Rectangles.
   
   
5. Osutage nüüd hiirekursoriga ülevalt teise ristküliku vasakule ülemisele nurgale ja klõpsake hiireklahvi seejärel osutage hiirekursoriga paremale alumisele nurgale ja klõpsake uuesti.
   
   Ilmub dialoogiaken Object URL.
   
   
6. Sisestame nüüd sellesse dialoogiaknasse järgmised andmed:
   
   URL for clicks on this object: loogilinevormindamine.htm
   Alternate (ALT) Text: Loogiline vormindamine
   TARGET (For frames; usually left blank!): paan
   
   Viimased kaks lahtrit jätke täitmata.
   
   
7. Klõpsake dialoogiakna Object URL korraldusnupul OK.
   
   
8. Klõpsame nüüd tööriistaribal asuval sinise ringiga nupul Add Circles.
   
   
9. Osutage ülevalt esimese ringi keskpunkti ja klõpsake hiirega seejärel osutage nüüd ringjoonele ja klõpsake uuesti hiireklahvi.
   
   Ilmub dialoogiaken Object URL.
   
   
10. Sisestame nüüd sellesse dialoogiaknasse järgmised andmed:
    
    URL for clicks on this object: paanid-2.htm
    Alternate (ALT) Text: Paanide kasutamine.
    TARGET (For frames; usually left blank!): paan
    
    Viimased kaks lahtrit jätke täitmata.
    
    
11. Klõpsake dialoogiakna Object URL korraldusnupul OK.
    
    Juhul kui teie aktiivne ala ei sattunud 100% kokku ettejoonistatud ringjoonega, siis on olemas võimalus juba loodud lingi muutmiseks.
    
    
12. Aktiivse ala nihutamiseks klõpsake tööriistaribal nupule, millel on kujutatud lendav lilla pallike (vasakult kolmanda nupurühma teine nupp) Move HotsPots.
    
    
13. Klõpsake nüüd ringikujulisel aktiivsel alal.
    
    Selle keskele ja servadesse ilmuvad pidemed. Osutades hiirega serval asuvale pidemele ja klõpsates saab muuta ringi suurust ja kui klõpsata aktiivse ala keskel oleval ristikesel siis saab muuta selle aukohta. (sama kehtib ka kõikide teiste aktiivete alade kohta)
    
    
14. Muutke ringikujulise aktiivse ala suurust ja asukohta nii, et ta langeb kujutise ringiga 100% kokku.
    
    Märgistuse mahavõtmiseks klõpsake hiirekursoriga väljaspool kujundit "grafmeny.gif".
    
    
15. Klõpsame nüüd tööriistaribal asuval punase kolmnurgaga nupul Add Polygons.
    
    
16. Osutage nüüd hiirekursoriga hulknurga suvalisele tipule ja klõpsake hiirega, nüüd osutage järgmisele tipule ja klõpsake uuesti ja nii edasi kuni klõpsuni uuesti esimesel tipul.
    
    
17. Hulknurga märgistamise lõpetamiseks klõpsake hiire parempoolset klahvi.
    
    Ilmub dialoogiaken Object URL.
    
    
18. Sisestame nüüd sellesse dialoogiaknasse järgmised andmed:
    
    URL for clicks on this object: test.htm
    Alternate (ALT) Text: Testitekstiga lehekülg.
    TARGET (For frames; usually left blank!): paan
    
    Viimased kaks lahtrit jätke täitmata.
    
    
19. Klõpsake dialoogiakna Object URL korraldusnupul OK.
    
    
20. Looge nüüd iseseisvalt lingid graafilise menüü all asuvale väiksele ringile ja ka suurele ringile. URL aadressiks sisestage: ujuvad-paanid.htm.
    
    
21. Klõpsake nüüd tööriistariba vasakult kolmanda rühma esimesel nupul sinise noolekesega Test and Edit Hotspots ja siis klõpsake suvalisel alal, mis asub väljaspool aktiivseid alasid hiire vasakpoolset klahvi.
    
    Ilmub dialoogiaken: Default URL.
    
    
22. Sisestage lahtrisse aadress: tabelid-2.htm ja klõpsake korraldusnupul OK.
    
    
23. Valige nüüd lõpetuseks programmi Map Edit punktist File korraldus Save HTML Document.
    
    Reeglina ilmub registreerimata versiooni puhul nüüd hoiatus. Klõpsake ka siin korraldusnupule OK.
    
    
24. Sulgege programm Map Edit valides punktist File korralduse Exit.

Ülesanne 4. Avame dokumendi ja parandame kaart-kujutise konfiguratsiooni.

1. Avage dokument "mapedit.htm" programmi Notepad abil.
   
   
   
2. Nagu te veenduda võite on teeki IMG lisatud parameeter usemap="#grafmeny".
   
   
3. Samuti on lisatud teek konteiner <MAP> koos vastavate aktiivsete alade kirjeldustega, kusjuures on teegi nimeks parameetris NAME vaikimisi pandud kujutise nimi: name="grafmeny".
   
   
4. Pange tähele asjaolu, et teegile <AREA> on juba meile tuttavate parameetritele lisatud parameeter TITLE, mille väärtus langeb kokku parameetri ALT väärtusega.
   
   
   
5. Asendame väiksema ringjoone parameetri href="ujuvad-paanid.htm" parameetriga NOHREF.
   
   
6. Lisame viimase aktiivse ala kirjeldusele parameetri: TARGET="paan".
   
   
7. Salvestame muudatused Notepadis ja värskendame lehitseja kuva.

Veenduge selles, et kõik kaart-kujutise lingid töötavad korrektselt. Nagu nägite ei erine programmi Map Edit töö tulemus käsitsi sisestatud aktiivsete alade kirjeldustest eriti palju. Kumb moodus on meelepärasem - otsustage ise.