Attēlu karte HTML formātā. Attēlu kartes izveide HTML AREA tagu atribūtos

Sākums / Windows 7
HTML tagi

Nozīme un pielietojums

Tag izmanto, lai definētu kartes attēlu. Attēlu karte ir attēls ar noteiktu aktīvo apgabalu. Elements satur skaitli tagi, kas definē interaktīvos apgabalus kartes attēlā, t.i. Noklikšķinot uz noteikta attēla apgabala, tiek veiktas noteiktas darbības, piemēram, tiek atvērta atsevišķa lapa ar šī attēla apgabala aprakstu.

Pārlūka atbalsts

Tag
Opera

IExplorer

Mala

Atribūti

Atzīmju atribūti mēs norādām gan apgabala koordinātas (koordņu atribūts), gan vajadzīgās formas veidu (shape atribūts):



Lietošanas piemērs

Apskatīsim piemēru, kurā, noklikšķinot uz noteiktas formas vienā attēlā, tiek atvērtas dažādas tīmekļa lapas, kurās ir aprakstītas šīs formas (saites uz Vikipēdiju):

</span> Tagu izmantošanas piemērs <map>

Izvēlieties figūru:

"Atlasīšanai pieejamas 4 formas"
> <span"Sarkanais laukums"> koordinātes = "200,75,50" href = "green.html" alt = "zaļš aplis." > !} <span"Zilais trīsstūris"> "450,25,435,60,400,75,435,90,450,125,465,90,500,75,465,60" href = "dzeltens.html" alt = "Dzeltena zvaigzne" > !}

Un secībā, ko mēs darījām šajā piemērā:

Es vēršu jūsu uzmanību uz to, ka, ja tag

Sveiki visiem. Andrejs Bernatskis ir ar jums.

Šajā apmācībā es runāšu par to, kā izveidot attēlu kartes HTML valodā.

Attēlu karte- tas ir sava veida attēls, varbūt fotogrāfija, kurai ir vairākas aktīvās zonas.

Piemēram, noklikšķinot uz aktīvās zonas, jūs pārejat uz noteiktu URL. Ja atrodaties vietnē vkontakte.ru, ir attēla kartes piemērs — tas ir, kad fotoattēlā atzīmējat, un, novietojot peles kursoru virs fotoattēlā atzīmētās personas, tiek parādīts viņa vārds un uzvārds, un noklikšķinot ar peli, tiek atvērta šīs personas lapa.

Pirmkārt, es jums piedāvāju šīs nodarbības video versiju:

Tas viss tiek darīts pavisam vienkārši. Mēs uzņemam jebkuru fotoattēlu ar draugiem. Labāk ir ievietot to atsevišķā blokā

.

XHTML

Es ņēmu savu fotoattēlu kā piemēru.

Par div dota id lai jūs varētu piešķirt dažus atkāpes vai jebko citu, kas būs nepieciešams. Es savā piemērā neko nejautāšu.

Tagas galvenais parametrs imgšajā gadījumā tā ir usemap="#img-nav". Tas norāda uz karti, ar kuru nosaukumu mēs atsauksimies.

XHTML

Andrejs

Ejam kārtībā.

— nosaukuma parametra vērtībai jāsakrīt ar img taga parametra usemap vērtību, tikai kartes tagam tas ir rakstīts bez simbola #.

Parametrs forma tagu — parāda, kāds būs mūsu reģions. Parametra vērtība parāda, kāds būs mūsu laukums forma:

taisnstūra – norāda, ka laukums būs taisnstūra formā.

poli – patvaļīgs daudzstūris.

aplis – laukums būs apļa formā.

Parametrs koordinātes satur mūsu apgabala koordinātas.

Ja forma = "taisna", tad tiek norādītas augšējā kreisā stūra un apakšējā labā stūra koordinātas. Tas ir, pirmais skaitļu pāris norāda uz augšējo kreiso pusi, bet otrais skaitļu pāris norāda uz apakšējo labo stūri.

Ja forma = "poli", tad tiek norādītas katras daudzstūra virsotnes koordinātas. shape="poly" coords="80,100,150,100,210,40,300,40,300,110"šajā gadījumā pirmās virsotnes koordinātas būs 80,100, otrās 150,100, trešās - 210,40, ceturtās - 300,40, piektās - 300,110.

Ja forma = "aplis", tad norādām centra un rādiusa koordinātas. forma = "aplis" coords="300,300,100" šeit centra koordinātas ir 300,300 un rādiuss ir 100.

title="Andrijs" alt="Andrejs" !} jau pazīstami parametri. Es pie tiem nekavēšos.

Pilns kods ir parādīts zemāk:

XHTML

"Es izveidoju veidni, lai noteiktos tā apgabalos ievietotu saites uz dažādām tīmekļa lapām ("").

Tagad, noklikšķinot uz formām ar uzrakstiem, tiks atvērtas atbilstošās lapas: profils, dienasgrāmata vai visi ieraksti no sadaļas “Photoshop Lessons” (uzmanību! pēc emuāra pārsūtīšanas uz WordPress un tā pārstrādāšanas saites nedarbojas! bet nodarbība joprojām ir aktuāla!)

Lai attēls darbotos, es uzrakstīju aptuveni šādu HTML kodu:

Šo kodu var ievietot ziņojuma laukā (nospiežot pogu "Avots") vai epigrāfā...

Starp citu, par šo tēmu ir arī citi ieraksti: “Kas ir HTML", "attēlu HTML kods", "Attēla saite” un tā tālāk.

1. Koordinātas

Lai izveidotu iepriekš minēto kodu, es atcerējos nelielu ģeometriju :)

Koordinātu sistēma: X ass - no augšas uz leju, Y ass - no kreisās uz labo pusi
Lai iestatītu figūras koordinātas, jāiestata:
- kvadrāts (vai taisnstūris), kura malas ir paralēlas asīm - divu pretējo leņķu koordinātes - X1, Y1 un X2, Y2
- daudzstūris - VISU leņķu koordinātas
- aplis - centra koordinātas un rādiuss.

Manā gadījumā izrādās, ka mums ir vajadzīgas punktu koordinātas A, C - saitei “Profils” (taisnstūris), punkti D, E, F, G, H - saitei “Dienasgrāmata” (daudzstūris), Q un garums R - saitei “ Photoshop Lessons” (aplis). Visi šie skaitļi augstāk esošajā HTML kodā ir iezīmēti sarkanā krāsā.

Turklāt jums jāzina attēla izmērs pikseļos (zaļā krāsā) Nav nepieciešama īpaša precizitāte, tāpēc koordinātas varat noteikt, izmantojot Photoshop “lineālu” - lai to izsauktu, noklikšķiniet uz

Ctrl+R Man bija interesantāk, ja kāds cits izrēķina koordinātas. Lai to izdarītu, es palaistu MS Paint

(Sākt - Visas programmas - Piederumi - Paint) un atveriet tajā zīmējumu. Novietojot kursoru virs vēlamajiem punktiem, apakšējā panelī parādās to koordinātas, kuras es rūpīgi pierakstu

2. HTML kods

Navigācijas kartes ir norādītas ar tagu Kartes tagā ir ietverti tagi

, kas nosaka zīmēšanas kartes ģeometriskos apgabalus un ar tiem saistītās saites.

Es to sapratu šādi: lai izveidotu navigācijas karti, jums ir nepieciešams:

tagi ar attēla aprakstu

kartes atzīmes

apgabala atzīmes

  • Manā gadījumā vērtības izrādījās šādas: platums="640" augstums ="367"
  • - attēla izmēri
  • src="https://site/f02c73a3cd94.jpg" - attēla adrese vietnē usemap="# attēls" — attēla kartes parastais nosaukums
  • (var būt jebkura) kartes nosaukums="bilde" (- kartes nosaukums pilnībā

Saites apgabalu vērtības — href — saites mērķis, forma — apgabala forma un koordinātes — koordinātas — atbilst trim attēla apgabaliem.

Taisnstūris "Profils"

  • href="https://site/profile/" — profila lapas adrese
  • shape="rekts" - "taisnstūra" formas apzīmējums
  • coords="235,61,472,117" — punktu A (235,61) un C (472,117) koordinātas

Daudzstūris "Dienasgrāmata"

  • href="https://site/blog" - dienasgrāmatas lapas adrese
  • shape="poly" - "daudzstūra" formas apzīmējums
  • coords="235,118,362,118,474,152,457,207,229,146" - daudzstūra stūru koordinātas: punkti D (235,118), E (362,118), F (474,152), G (457,20) 9 un 1 (20) 2

Aplis "Photoshop nodarbības"

  • href="https://site/showjournal.php?journalid=2447247&keywordid=929323" — ziņu lapas adrese no sadaļas "Photoshop apmācības"
  • shape="circle" - "apļa" formas apzīmējums
  • coords="551,198,65" — apļa koordinātas: centrs — punkts Q (551,198) un rādiuss — R=65

3. Pabeigt

Visas iegūtās vērtības aizvietoju navigācijas attēla kartes “sistēmas” HTML kodā un ieguvu sekojošo:

Tieši šis kods, to lietojot, “pārvēršas” attēlā ar saišu apgabaliem.

Apmācībai ir “viegla” vienkārša saišu apgabalu izveides iespēja - ziņa “Apmācība: saišu apgabali attēlā”

Ja atrodat kļūdu, lūdzu, iezīmējiet teksta daļu un noklikšķiniet Ctrl+Enter.

Pēdējā laikā daudzas tīmekļa lapas izmanto tā sauktās attēlu kartes, lai sakārtotu saites. Šīs funkcijas ieviešanu nodrošina HTML valoda, un tā ļauj saistīt hiperteksta saites ar dažādiem attēla apgabaliem. Šī pieeja ir vizuālāka nekā parastu teksta saišu izmantošana, jo lietotājam nav jālasa saites verbāls apraksts, bet gan uzreiz jāsaprot tās nozīme no grafiskā attēla.

Pat iesācējs lietotājs, izklīdis pa internetu, drīz nonāks pie attēlu kartes. Attēlā 6.1. attēlā parādīta viena no lielākajām datorkompānijām Krievijā Web lapa. Šīs lapas galvenā izvēlne ir attēlu karte ar atbilstošām saitēm.

Slavenās meklētājprogrammas Yahoo! rezultātā tiek parādīta arī lapa, kurā ir attēlu karte. Attēlā redzamā attēla augšējā daļā ir četras pogas, starp kurām ir rakstīts vārds "Yahoo!" Kursors attēlā norāda uz pirmo no šīm pogām, un kursora forma skaidri parāda, ka pēdējā norāda uz saiti, kuras adrese ir redzama pārlūkprogrammas statusa joslā. Ar šīm pogām realizētās saites tiek veidotas, izmantojot attēlu karšu tehnoloģiju.

Tomēr nevajadzētu pieņemt, ka attēlu kartes ir jāizmanto visur, kur nepieciešama saišu navigācija. Jāapsver, vai ir jēga izmantot attēlu kartes konkrētā gadījumā, izsverot plusus un mīnusus. Šajā nodaļā ir visa nepieciešamā informācija par attēlu karšu izmantošanu.

Šajā nodaļā jūs uzzināsiet:

  • Kas ir attēlu karte un kā tā darbojas?
  • Kā izveidot attēla kartes konfigurācijas failu
  • Kā izveidot saites HTML dokumentā, izmantojot attēlu karti

Rīsi. 6.1. Tīmekļa lapas piemērs, kurā galvenā izvēlne tiek veidota, izmantojot attēlu karti

  • Kādi principi jāievēro, izmantojot attēlu kartes?
  • Kādas ir dažādu attēlu karšu konfigurācijas failu formātu funkcijas?
  • Kāda programmatūra jāizmanto, lai izveidotu attēlu kartes?

Attēlu kartes pamati

Attēlu kartes nodrošina lietotājiem draudzīgu saskarni, lai pārvietotos uz citām Web lapām. Lai sekotu šādai saitei, vienkārši atlasiet vajadzīgo vietu attēlā un noklikšķiniet uz. Šāda izstrādāta grafiskā interfeisa klātbūtne ir viena no būtiskām Web lapu priekšrocībām salīdzinājumā ar citiem interneta resursiem. Gopher klienta saskarnei līdzīgu teksta izvēlņu vietā lietotāji saņem skaidru grafisku informācijas attēlojumu (6.2. attēls).

Rīsi. 6.2. Saišu vizuāls attēlojums (uz lapām, kas stāsta par septiņiem pasaules brīnumiem), izmantojot attēlu karti

Attēlu karte izskatās kā parasts iegults attēls, taču, atlasot noteiktu šī attēla apgabalu ar peles kursoru, tā pāriet uz citām lapām. Parasti attēls norāda, kur jānoklikšķina, lai pārietu uz konkrētu lapu. Ir vairāki veidi, kā norādīt apgabalu robežas, kas īsteno dažādas saites. Bieži tiek izmantots rāmis vai kāds cits norobežotājs.

Apskatīsim pamatjēdzienus, kas saistīti ar attēlu karšu izmantošanu.

Terminoloģija

Attēlu karte, attēlu karte, apgabala karte, noklikšķināma karte, jutīga karte - visi šie angļu valodas termini tiek lietoti atsauces literatūrā, lai apzīmētu vienu un to pašu iespēju - HTML dokumentā iegulta attēla izmantošanu, kuram ir “karsti” (vai aktīvi) punkti. definēti vai apgabali, kuros ir saites uz dažādiem URL. Šo iespēju aprakstīsim ar frāzi “attēlu karte”, kas nozīmē vairāku komponentu kombināciju, kas nodrošina šīs koncepcijas īstenošanu. Galvenās sastāvdaļas ir: pats attēls, ko mēs sauksim par atsauces attēlu šai attēla kartei; aktīvo zonu konfigurācijas apraksts; kā arī saistīto programmatūru.

Attēlu kartes grafiskais attēlojums

Attēlu karte būtībā ir tīmekļa lapā iegulta grafika. Šie attēli var būt jebkurā derīgā formātā (GIF vai JPG). Šajā gadījumā GIF formātā var izmantot caurspīdīgu krāsu, kā arī mainīgu līniju režīmu. Lai attēlu varētu izmantot kā atsauci attēlu kartei, formāli netiek noteikti nekādi papildu ierobežojumi.

Attēlu kartes konfigurācijas apraksts

Attēlu kartes konfigurācija ir uzrakstīta vienkāršā tekstā, ko atkarībā no izmantotā formāta var saglabāt atsevišķā failā vai būt daļa no HTML dokumenta. Konfigurācijas aprakstā ir norādītas katra attēla aktīvā apgabala koordinātas, kā arī ar katru no šiem apgabaliem saistītie URL. Karstos punktus var veidot kā taisnstūrus, apļus vai daudzstūrus. Ir atļauta jebkura šo skaitļu kombinācija. Vienu URL vērtību var norādīt arī tad, kad lietotājs noklikšķina uz attēla, bet ārpus norādītajiem tīklājiem. Īpašie tvēruma konfigurācijas ierakstīšanas noteikumi ir atkarīgi no izvēlētās ieviešanas opcijas, un tie tiks parādīti tālāk.

Attēlu karšu ieviešanas iespējas

Attēlu kartes koncepcija Web lapās var tikt realizēta divās dažādās versijās - servera puses attēlu kartē un klienta puses attēlu kartē. Pēdējais nosaukums bieži tiek izmantots kā saīsinājums CSIM. Vēsturiski pirmā parādījās un plaši izplatījās attēlu karšu servera versija, kas pirmo reizi tika ieviesta pārlūkprogrammā Mosaic. Servera versija ļāva izmantot visu trīs vadošo pārlūkprogrammu pirmās versijas. Servera versiju var ieviest divos dažādos formātos, kas nosaukti pēc izstrādātāju organizāciju nosaukumiem – NCSA un CERN.

Pēdējā laikā arvien vairāk tiek izstrādāta klienta versija, kas pirmo reizi tika ieviesta pārlūkprogrammā Microsoft Internet Explorer. Sākot ar versiju 2.0, šī opcija atbalsta arī Netscape pārlūkprogrammu. Šai iespējai ir nenoliedzamas priekšrocības, un tā kļūst arvien populārāka.

Attēlu karšu priekšrocības un trūkumi

Attēlu karšu izmantošanai ir gan pozitīvi, gan negatīvi aspekti. Lielākajai daļai no tiem ir estētisks raksturs, taču dažiem ir arī tehniski aspekti. Lai izveidotu labas Web lapas, ir svarīgi saprast attēlu karšu priekšrocības un trūkumus.

Attēlu kartes visērtāk ir izmantot šādās situācijās:

  • Lai attēlotu telpiskās attiecības, piemēram, ģeogrāfiskās koordinātas, kuras būtu grūti norādīt, izmantojot atsevišķas pogas vai tekstu. Piemērs ir Ziemeļamerikas karte, kurā, atlasot katru štatu, tiek atvērta atbilstošā lapa.
  • Kā augstākā līmeņa izvēlne, kas parādās katrā lapā. Šādas izvēlnes klātbūtne ļauj no jebkuras lapas un jebkurā laikā pāriet uz interesējošā servera sadaļu. Kopīgas grafiskās izvēlnes izveide samazinās izstrādes laiku

HTML dokumentus, jo tiks izmantots tas pats saites apraksta fails. Tā vietā, lai katrā lapā izveidotu saites uz dažādām sākumlapas daļām, jums vienkārši ir jāizveido saite uz vispārējo izvēlni. Šāda izvēlne lietotājam arī atvieglos navigāciju.

Neskatoties uz to, ka attēlu kartes ir kļuvušas ārkārtīgi populāras, ir skaidrs, ka tās nav Web lapu neatņemams atribūts un netiek izmantotas visās lapās. Ir situācijas, kad nevajadzētu izmantot attēlu kartes.

Attēlu karšu trūkumi ir šādi:

  • Ja alternatīva teksta izvēlne nav nodrošināta, nav pieejama navigācija lietotājiem, kuri nevar ielādēt grafiku vai ir atspējojuši grafikas ielādi.
  • Attēlu kartēm ir tādi paši trūkumi, kas saistīti ar attēlu izmantošanu tīmekļa lapās, proti, ievērojami palielinās ielādes laiks, salīdzinot ar tīri teksta dokumentiem.
  • Slikti izstrādāti attēli var radīt neskaidrības. Dažreiz var būt grūti noteikt, kuri attēla apgabali ir aktīvi. Īpaši grūti to izdarīt servera versijā. Ieviešot klienta versiju, situācija ir vienkāršota, jo ir iespējams pārvietot peli attēla ietvaros un pārraudzīt pārlūkprogrammas loga apakšā redzamās saišu adreses.
  • Izmantojot attēlu kartes, pārlūkprogrammai nav iespējas atzīmēt jau apmeklētās saites ar citu krāsu tāpat kā teksta saitēm.

Attēlu karšu ieviešana servera pusē

Attēlu karšu izmantošana tīmekļa lapās izrādās nedaudz sarežģītāka nekā vienkārša interesanta grafika iegulšana un saistīšana ar tām. Lai ieviestu attēla kartes servera versiju, ir nepieciešams, lai HTML dokuments tiktu mitināts serverī. Ir arī nepieciešams, lai serveris būtu konfigurēts, lai atbalstītu CGI skriptus (Common Gateway Interface), kas apstrādā pieprasījumus, kas saņemti no pārlūkprogrammas, strādājot ar attēlu karti. Katrai attēla kartei serverī ir jāievieto fails, kas apraksta aktīvo apgabalu konfigurāciju. Kad noklikšķināt uz attēla, pārlūkprogramma nosūta koordinātas, kur noklikšķināt uz serveri, kas piekļūst konfigurācijas failam, kas būtībā ir tīklāja uzmeklēšanas tabula. Meklēšanas rezultāts tiek atgriezts pārlūkprogrammā URL vai ziņojuma veidā, kas norāda, ka nav atrasti tīklāji, kas atbilst norādītajai atrašanās vietai attēlā.

Lai nodrošinātu attēlu kartes darbību, ir jānorāda, ka šis attēls ir kartes atsauces attēls. Tas tiek darīts, tagā iestatot parametru ISMAP . Turklāt attēla karte ir jāpadara par saiti Web lapā, līdzīgi kā izmantojot visu attēlu kā atsevišķu saiti.

Atgādinām, ka iekļautos attēlus var izmantot kā hiperteksta saites, ja tie ir iekļauti tagā<А>. Piemēram, lai attēlu ar nosaukumu Myimage.gif padarītu par grafisku saiti uz dokumentu tajā pašā direktorijā ar nosaukumu exampie.html, jums jāraksta:

<А HREF=example.html >

Šis HTML norāda serverim, ka, noklikšķinot uz Mylmage.gif attēla, pārlūkprogrammā ir jāatgriež dokuments ar nosaukumu example.html.

Tagam pievienots ISMAP parametrs dotajam piemēram aktivizē attēla karti. Šajā gadījumā saite nav uz konkrētu dokumentu, bet gan uz attēla kartes konfigurācijas failu, kurā ir visu attēla aktīvo apgabalu koordinātas. Konfigurācijas failu, parasti ar MAP paplašinājumu, CGI programma serverī parsē kopā ar attēla klikšķa punkta koordinātām. Tad iepriekš minētās rindas vietā jāraksta:

<А HREF=MyImage.map>< IMG SRC=MyImage.gif ISMAP>< /A>

Saite šajā piemērā nav cita HTML dokumenta adrese, bet gan attēla kartes konfigurācijas fails, kurā ir koordinātas katram attēla aktīvajam apgabalam ar nosaukumu Myimage.gif.

Piezīme

Tagu parametru secība ir patvaļīgs, tomēr ISMAP parametrs parasti tiek novietots pēdējais.

Attēla kartes konfigurācijas fails ir parasts teksta fails, kurā ir informācija par konkrēta attēla aktīvajiem apgabaliem. Katram attēlam, kas tiks izmantots kartes režīmā, ir nepieciešams atsevišķs konfigurācijas fails.

Padoms

Katrai attēla kartei ir nepieciešams atsevišķs konfigurācijas fails. Izveidojiet ieradumu saglabāt konfigurācijas failu tajā pašā direktorijā un ar tādu pašu nosaukumu kā ar to saistītajam attēlam. Piemēram: galvenā_izvēlne.gif un galvenā izvēlne.karte.

Ir divi attēlu karšu konfigurācijas failu formāti, ko izstrādājuši CERN un NCSA un uz kuriem ir šo organizāciju nosaukumi. Abos šajos formātos ir viena un tā pati informācija, taču tā tiek pasniegta atšķirīgi. Abos gadījumos tiek izmantotas viena veida zonas, kas ir aplūkotas turpmāk. Izstrādājot attēlu kartes lietošanai uz konkrēta servera, jums ir jāiegūst informācija no sistēmas administratora par to, kas tika pieņemts šis serveris veids, kā atbalstīt attēlu kartes.

Abi formāti izmanto aktīvos apgabalus taisnstūru, apļu un daudzstūru formā, kā arī var norādīt tā saukto noklusējuma apgabalu, kas raksturo visus apgabala punktus, kas nepieder nevienam no aktīvajiem apgabaliem. Ja lietotājs noklikšķina attēla iekšpusē, bet ārpus kāda no norādītajiem tīklājiem, URL tiks iestatīta vērtība, kas noteikta pēc noklusējuma veida.

Katram apgabalam konfigurācijas failā tiek ierakstīts URL, kas tiks atgriezts lietotājam, kad šajā apgabalā notiks klikšķis. Šo adresi var rakstīt relatīvā vai absolūtā formā. Ņemiet vērā, ka relatīvais URL ir jādefinē attiecībā pret konfigurācijas faila, nevis attēla faila atrašanās vietu. Konfigurācijas faila aktīvo apgabalu saraksts tiek nolasīts, sākot no pirmās rindas. Ja divi tvērumi pārklājas, tiek ieviesta saite, kuras tvēruma apraksts konfigurācijas failā parādās pirmais.

Padoms

Ieteicams konfigurācijas failā vienmēr iestatīt noklusējuma saiti. Noklusējuma saite tiks ieviesta tiem attēla apgabaliem, kas nav aktīvi. Vienkāršākajā gadījumā noklusējuma URL varētu vienkārši norādīt uz lapu ar noderīga informācija par šīs kartes lietošanu.

CERN formāts

CERN ir Eiropas zinātnes centrs, kura pētījumu tēmas ir ļoti plašas. Tieši šeit tika izstrādāta globālā tīmekļa sistēmas koncepcija, kas bija stimuls visām norisēm WWW jomā. CERN var pamatoti uzskatīt par tīmekļa dzimteni. Kad radās nepieciešamība izstrādāt attēlu karšu konfigurācijas failu struktūru, CERN piedāvāja šādu formātu:

apgabala tipa koordinātu URL

X un Y koordinātu pāru vērtības ir atdalītas ar komatu un ievietotas iekavās. CERN formāts neļauj komentāros izskaidrot atsauces, kas saistītas ar konkrētu jomu. Var izmantot šādus apgabalu veidus: taisnais, aplis, poli un noklusējuma. Šis formāts ļauj apgabalu tipu nosaukumus rakstīt divos veidos – gan saīsinātā, gan pilnā formā. Kopā ar dotajiem tipu nosaukumiem var izmantot nosaukumus taisnstūris, aplis un daudzstūris.

Šeit ir piemērs informācijas ierakstīšanai par apgabaliem attēlu kartē CERN formātā:

taisnā (56.47) (357.265) http://www.anywhere.com/

circ (366 147) 109 http://www.anywhere.com/

daudzstūris (534.62) (699.62) (698.236) (626.261) (534.235) (534.62)

http://www.anywhere.com/

NCSA formāts

Ilinoisas Universitātes Nacionālais superskaitļošanas lietojumprogrammu centrs (NCSA) arī ir devis nozīmīgu ieguldījumu tīmekļa attīstībā. Šeit tika izveidota pirmā populārā grafiskā pārlūkprogramma Mosaic. NCSA ierosināja konfigurācijas faila formātu, kas ierakstīšanas formā atšķiras no CERN formāta. Šis formāts izskatās šādi:

area_type URL koordinātas

Var izmantot šādus apgabalu veidus: taisnais, aplis, poli, noklusējuma un punkts.

X un Y koordinātas ir atdalītas ar komatiem, bet nav ievietotas iekavās. Šis formāts ļauj izmantot komentāru rindiņas. Jebkura rinda, kas sākas ar rakstzīmi #, tiks uzskatīta par komentāru, un parsētājs ignorēs tās saturu.

NCSA formāts piedāvā nedaudz atšķirīgu veidu, kā definēt apļveida apgabalus (salīdzinājumā ar CERN formātu un tālāk aplūkoto klienta versiju). Apļveida laukumu nosaka divu punktu koordinātas - centra un jebkura punkta, kas atrodas uz apļa.

Piezīme

NCSA formāts ļauj izmantot punktu apgabala tipu. Šis apgabala veids netiek izmantots ne CERN formātā, ne arī, izmantojot attēlu karšu klienta versiju. Formāta veidotāju nolūks bija tāds, ka, ja būtu vairāki punktoti apgabali, ar peles klikšķi tiktu aktivizēta pārējām tuvākā saite. Tomēr šāda veida apgabala esamība būtībā ir pretrunā ar noklusējuma apgabala tipu, jo, vienlaikus izmantojot punktu un noklusējuma apgabalus, pēc punkta veida definētas saites ieviešana ir iespējama tikai tad, ja pele precīzi trāpa norādītajā punktā. Tas ir diezgan grūti un, visticamāk, neradīs ērtus apstākļus, strādājot ar šādu dokumentu. Šobrīd punktu tips praktiski netiek izmantots, un arvien vairāk tiek attīstīta attēlu karšu klienta versija.

Šeit ir piemērs konfigurācijas faila rakstīšanai NCSA formātā:

# Konfigurācijas faila rakstīšanas piemērs

taisni http://www.anywhere.com/ 56.47 357.265

aplis http://www.anywhere.com/ 366 147 366 256

poli http://www.anywhere.com/ 534,62 699,62 698,236 626,261 534,235 534,62

Attēlu kartes klienta versija

Attēla kartes klienta versija ļauj ievietot visu informāciju par kartes konfigurāciju HTML failā, kurā ir iegults attēls. Servera opcijas izmantošanas gadījumā pārlūkprogramma nosūta serverim pieprasījumu iegūt izvēlētās saites adresi un gaida atbildi ar nepieciešamo informāciju. Tas var prasīt papildu gaidīšanas laiku. Ar klienta versiju samazinās zvanu skaits uz serveri un palielinās piekļuves ātrums informācijai. Šajā opcijā arī nav jāsazinās ar serveri, lai rediģētu kartes konfigurāciju, tāpēc visu darbu pie attēla kartes izveides var veikt lokāli, vienlaikus ar HTML faila rediģēšanu. Atšķirībā no servera opcijas, kurā katrai attēla kartei bija nepieciešams atsevišķs konfigurācijas fails, šajā opcijā kartes konfigurāciju var atrast tieši tajā pašā HTML dokumentā, kurā norādīta atsauces attēla saite. Visbiežāk viņi rīkojas tieši tā, lai gan ir pieņemams saglabāt kartes konfigurāciju atsevišķā failā un nodrošināt saiti uz to.

Lai norādītu, ka iegultais attēls ir kartes atsauces attēls, izmantojiet USEMAP taga parametru . Parametra USEMAP vērtība ir atsauce uz kartes konfigurācijas aprakstu.

Piezīme

Netscape pārlūks neļauj izmantot atsevišķu failu, lai aprakstītu kartes konfigurāciju.

Piemēram:

Šajā piemērā attēls, kas saglabāts failā ar nosaukumu l ogo.gif, ir atsauces attēls klienta puses attēlu kartei.

Hotspot konfigurācijas aprakstam ir jāatrodas tajā pašā failā, kur šī HTML koda rindiņa, un šajā piemērā tam jābūt nosauktam par logotipu.

Tag<МАР>

Īpaša atzīme tiek izmantota, lai aprakstītu attēla kartes apgabalu konfigurāciju<МАР>, kura vienīgais parametrs ir NAME. Parametra NAME vērtība norāda nosaukumu, kuram ir jāatbilst USEMAP nosaukumam. Tag<МАР>nepieciešama beigu atzīme. Šī atzīmju pāra iekšpusē ir jābūt to kartes aktīvo apgabalu aprakstiem, kuriem tiek izmantota īpaša atzīme .

Tag

Katra atsevišķa atzīme norāda vienu aktīvo reģionu. Beigu tags nav nepieciešams. Aktīvie reģioni var pārklāties. Ja konkrēts punkts vienlaikus pieder vairākām aktīvajām zonām, tad tiks ieviesta saite, kuras apraksts atrodas apgabalu sarakstā pirmajā vietā.

Tagu parametri ir SHAPE, COORDS, HREF, NOHREF, TARGET un ALT. Apskatīsim šo parametru mērķi.

SHAPE parametrs

Parametrs SHAPE nosaka aktīvās zonas formu. Derīgās vērtības ir rect, circle, poly, noklusējuma. Šīs vērtības nosaka apgabalus taisnstūra, apļa vai daudzstūra formā. Pēdējā vērtība – noklusējuma vērtība – nosaka visus apgabala punktus. Ja parametrs SHAPE ir izlaists, noklusējuma vērtība ir rect, t.i., laukums taisnstūra formā.

Brīdinājums

Nejauciet noklusējuma tipa apgabalu, kas apraksta visus attēla punktus, un parametra SHAPE noklusējuma vērtību, kas ir taisna.

Piezīme

Atšķirībā no servera versijas, kur noklusējuma apgabals definēja visus attēla punktus, kas nepieder nevienam aktīvam apgabalam, klienta opcijai noklusējuma apgabals nosaka visus attēla punktus. Tāpēc šajā gadījumā noklusējuma apgabala aprakstam jāatrodas pēdējā aktīvo apgabalu sarakstā. Ja, piemēram, noklusējuma apgabala apraksts ir ievietots vispirms, tad šī apgabala definētā saite vienmēr tiks ieviesta klienta versijai un visas pārējās saites tiks ignorētas (šāda veida apgabals tiek realizēts Netscape ). Servera versijai noklusējuma apgabala apraksta atrašanās vietai nav nozīmes. Šī atšķirība ir ņemta vērā piemēros, kas sniegti nodaļas beigās.

Padoms

Ņemiet vērā arī to, ka ne visas pārlūkprogrammas atbalsta noklusējuma apgabala veidu. Jo īpaši Microsoft Internet Explorer vispār nepieļauj šāda veida darbības jomu. Tāpēc noklusējuma tipa apgabala vietā mēs varam ieteikt iestatīt taisnstūrveida laukumu, kura izmēri ir vienādi ar visa attēla izmēru. Protams, šāda teritorija jāapraksta pēdējā. Tieši to dara dažas attēlu karšu rediģēšanas programmas, kas tiks apspriestas tālāk.

COORDS parametrs

Parametrs COORDS norāda viena aktīvā apgabala koordinātas. Parametra vērtība ir to punktu koordinātu saraksts, kas nosaka aktīvo apgabalu, atdalītas ar komatiem. Koordinātas raksta kā nenegatīvus veselus skaitļus. Izcelsme atrodas attēla augšējā kreisajā stūrī, kas atbilst vērtībai 0,0. Pirmais cipars nosaka horizontālo koordinātu, otrais - vertikālo. Koordinātu saraksts ir atkarīgs no apgabala veida.

Taisnā tipa laukumam ir norādītas taisnstūra augšējā kreisā un apakšējā labā stūra koordinātas.

Apļa tipa apgabalam ir norādīti trīs skaitļi - apļa centra koordinātas un rādiuss.

Poli tipa apgabalam daudzstūru virsotņu koordinātas ir norādītas vajadzīgajā secībā. Ņemiet vērā, ka pēdējam punktam koordinātu sarakstā nav jāsakrīt ar pirmo. Ja tie nesakrīt, pārlūkprogramma automātiski savienos pēdējo punktu ar pirmo, interpretējot attiecīgā reģiona formas datus. Dažādi attēlu karšu redaktori šajā ziņā darbojas atšķirīgi – daži pievieno pirmo punktu saraksta beigām, bet citi to nedara. Kvantitatīvie ierobežojumi virsotņu skaitam ir diezgan lieli un aptver gandrīz visas iespējamās vajadzības. Vismaz daudzstūri ar 100 virsotnēm droši apstrādā visas vadošās pārlūkprogrammas. Ar pašu HTML valodu ir saistīts ierobežojums, saskaņā ar kuru sarakstā nedrīkst būt vairāk par 1024 vērtībām. Daudzstūris var būt arī neizliekts.

Noklusējuma tipa apgabalam nav jānorāda koordinātas.

HREF un NOHREF parametri

HREF un NOHREF opcijas ir viena otru izslēdzošas. Ja neviens no šiem parametriem nav norādīts, tiek uzskatīts, ka reģionam nav saites. Tas pats skaidri definē NOHREF parametru, kuram nav nepieciešama vērtība. HREF parametrs norāda saites adresi, ko var rakstīt absolūtā vai relatīvā formā. Rakstīšanas noteikumi pilnībā sakrīt ar saišu rakstīšanas noteikumiem tagā<А>.

NOHREF parametrs ir noderīgs, lai izslēgtu daļu no aktīvā reģiona. Ļaujiet, piemēram, jums izveidot aktīvo apgabalu gredzena formā. Šāda veida platība nav iekļauta iespējamo platību sarakstā, taču to var īstenot, norādot divus apļveida laukumus. Lai to izdarītu, vispirms ir jādefinē mazāka rādiusa apgabals un kā parametrs jānorāda NOHREF. Tālāk jums jānorāda lielāka rādiusa apgabals ar centru tajā pašā punktā un jānorāda vēlamā saite. Tad laukumam gredzena iekšpusē, ko nosaka divi dažādu rādiusu apļi, būs nepieciešamā saite. Izmantojot pieeju, kas balstīta uz platību savstarpēju pārklāšanos, būs iespējams izveidot ļoti dažādu formu laukumus.

TARGET parametrs

Darbā ar rāmjiem tiek izmantots parametrs TARGET. Tās mērķis ir norādīt rāmja nosaukumu, kurā tiks ievietots no šīs saites lejupielādētais dokuments. Papildinformāciju par šīs opcijas izmantošanu skatiet nodaļā par darbu ar rāmjiem.

ALT parametrs

Parametrs ALT ļauj rakstīt alternatīvu tekstu katram attēla aktīvajam apgabalam. Būtībā šim tekstam būs tikai dokumenta veidotāja komentāra loma. Ja alternatīvais teksts ir rakstīts visam attēlam (tagā ), tiek izmantots, lai to parādītu ekrānā, strādājot ar atspējotu attēlu ielādi, tad ekrānā nekad neparādīsies alternatīvais aktīvo apgabalu teksts.

Šeit ir piemērs dažādu veidu apgabalu norādīšanai:

<МАР NAME="logo">

Taisnstūrveida</p> <p>area !}

Apļveida zona

HREF="p.htm" ALT="Daudzstūris"> !}

Šis koda fragments tiek ievietots HTML failā. Bieži vien visi viena dokumenta attēlu kartes apraksti tiek apkopoti un ievietoti sadaļas sākumā dokumentu. Šī pieeja ir tuva programmētājiem, kuri parasti, rakstot programmas, atdala programmas aprakstošo daļu no izpildāmās daļas, kas vienkāršo rakstītā koda izpratni, un dažkārt to nosaka kompilatora prasības.

Klienta un servera opciju kombinācija

Ir pieļaujams izmantot kombinētu opciju, kurā abi parametri - USEMAP un ISMAP - ir definēti vienam attēlam, kas nozīmē šī attēla izmantošanu kā atsauci gan klienta, gan servera opcijām. USEMAP ir dominējošais parametrs. Tas nozīmē, ka pārlūkprogramma, kas atbalsta klienta opciju, izmantos USEMAP, ignorējot ISMAP parametru norādījumus. Tās pārlūkprogrammas, kuras neatbalsta klienta opciju un nesaprot USEMAP parametra mērķi, saskaņā ar vispārīgajiem HTML noteikumiem, ignorēs tā klātbūtni un ieviesīs servera opciju, kad konstatēs ISMAP parametra klātbūtni. Kombinētā opcija ir uzticamāka, taču ir nepieciešami dati, lai konfigurētu apgabalus abām opcijām. Mūsdienās nepieciešamība izmantot kombinēto opciju arvien vairāk samazinās, jo visas vadošās pārlūkprogrammas atbalsta klienta opciju. Taču Netscape mājas lapas, ar kurām, iespējams, ir saskāries jebkurš Netscape pārlūka lietotājs, ir veidotas kombinētā versijā.

Šeit ir apvienotas opcijas piemērs:

<А HREF="http://www.anywhere.com/testmap/logo.map">

Piezīme

Parametrs USEMAP dominē arī pār tagā definēto saiti<А>. Tātad, ja attēls, kas izmantots attēla kartes koncepcijas ieviešanai klienta versijā, ir ierakstīts taga tvērumā<А HREF>, tad saite, kas identificēta ar pēdējo tagu, tiks ignorēta pārlūkprogrammās, kas atbalsta klienta puses opciju. Ļaujiet, piemēram, iegūt šādu fragmentu:

<А HREF=NoMaps.htm> .

No vienas puses, viss attēls ir saite uz dokumentu ar nosaukumu NoMaps.htm. No otras puses, USEMAP parametra klātbūtne definē šo attēlu kā atsauces attēlu atbilstošajai attēla kartei. Atsauce uz dokumentu NoMaps.htm tiks ignorēta USEMAP parametra klātbūtnes dēļ un neatkarīgi no citiem faktoriem.

Attēlu karšu izmantošanas iespējas

Ļaujiet mums atzīmēt dažas funkcijas, kas saistītas ar attēlu karšu izmantošanu klienta versijā. Kad lietotājs pārvieto peli attēlā, kurā ir ieviesta klienta puses opcija, atbilstošais URL tiek parādīts statusa joslā Netscape pārlūkprogrammas apakšā. Servera puses opcijā URL netiek rādīts, jo informācija tiek mitināta serverī, kas nav pieejams, kamēr lietotājs nenoklikšķina uz attēla. Pirmais variants ir informatīvāks, jo lietotājs redz saišu adreses un var arī noteikt attēla atrašanās vietu bez saitēm. Servera versija parāda skaitļus, kas ir relatīvas peles koordinātas uz attēla un nesniedz nekādu informāciju par saitēm un to klātbūtni.

Alternatīvi navigācijas līdzekļi

Attēlu karšu izmantošana ir kļuvusi izplatīta, taču nevajadzētu aizmirst, ka ne visi tīmekļa lietotāji var izmantot grafiku vai vēlas strādāt ar atspējotu attēlu ielādi, lai samazinātu failu pārsūtīšanas laiku. Tādēļ jums ir jānodrošina kāds cits, alternatīvs navigācijas līdzeklis lapā. Pretējā gadījumā lietotāji vispār nevarēs atrast lapā un attiecīgi ieviest tās saites, kuras definē tikai attēlu karte.

Kā alternatīvu varat izveidot atsevišķu sadaļu ar teksta aprakstu saitēm un atbilstošajiem URL. Varat arī izveidot saiti uz teksta izvēlne, kurai ir tādi paši savienojumi kā attēla kartei. Neatkarīgi no izvēlētās pieejas jums ir jāpārliecinās, ka visas saites ir pieejamas pārlūkprogrammas teksta režīmā.

Ļaujiet mums sniegt piemēru reālam dokumentam, kurā šie jautājumi ir atrisināti. Vienā no labi zināmās kompānijas Hewlett-Packard lapām redzams fragments, kurā ir attēlu karte. Lapas vidū ir desmit dažādu veidu aprīkojuma saraksts, no kuriem katram ir saite uz atbilstošo dokumentu. Faktiski lapā ir attēls, kas ir kartes atsauces attēls. Šajā attēlā ir izceltas desmit taisnstūrveida zonas, kas ir aktīvie reģioni.

Ja ielādēsiet šo lapu ar atspējotu attēlu ielādes režīmu, jūs redzēsiet attēlu, kurā attēla kartes vietā ir tikai neliela ikona, kas parāda attēla atrašanās vietu un. teksts, kas ir iestatīts kā alternatīvs teksts visam dotajam attēlam. Acīmredzot jūs nevarēsit izmantot šeit esošās saites. Lai atrisinātu šo problēmu, zem attēla ir parasta teksta izvēlne, kas pilnībā atkārto attēlā redzamo sarakstu ar atbilstošajām saitēm. Tāpēc, ja attēla ielāde ir atspējota, lietotājs joprojām varēs īstenot nepieciešamās saišu pārejas, izmantojot dublikāta teksta izvēlni. Ielādējot attēlu, teksta izvēlne dublē tikai saišu atlases opcijas.

Attēlu kartēšanas rīki

Attēlu karšu izveidei ir jāveic divas darbības: jāsagatavo atsauces attēls, kurā pēc tam tiks definēti aktīvie reģioni, un jāizstrādā konfigurācijas fails, kas apraksta aktīvo reģionu ģeometriskos parametrus. Attēla sagatavošana, kas kalpos par pamatu attēlu kartei, neatšķiras no parastu Web lapās iegultu attēlu sagatavošanas. Lai to izdarītu, varat izmantot jebkuru grafisko redaktoru vai izmantot gatavu attēlu.

Otrajā darbībā attēlā jāatzīmē aktīvās zonas un jāsaskaņo tās ar atbilstošo saišu adresēm. Konfigurācijas faila sagatavošana ir visgrūtākais solis attēlu karšu izveidē. Principā ir iespējams manuāls veids, kā iestatīt attēla aktīvo apgabalu robežas. Piemēram, strādājot grafiskajā redaktorā, var atzīmēt atsevišķus punktus, ierakstīt to koordinātas un pēc tam izveidot failu, kurā aprakstīti atlasīto apgabalu ģeometriskie parametri. Tomēr šī pieeja ir ārkārtīgi neērta un apgrūtinoša.

Lai automatizētu attēla apgabalu iezīmēšanas procesu, ir vairākas programmas, no kurām lielākā daļa ir ļoti līdzīgas viena otrai. Tie ļauj izveidot un modificēt konfigurācijas failus, strādājot tieši ar attēlu ekrānā. Lielākā daļa programmu ir atsevišķas utilītas, kas darbojas neatkarīgi un būtībā ir HTML redaktoru papildinājumi. Šīs programmas ļauj saglabāt ģenerēto konfigurācijas failu vai nu Windows starpliktuvē, vai failā diskā. Pirmajā gadījumā tipiska iespēja ir attēlu karšu rediģēšanas programmas un kāda veida HTML redaktora vai parastā teksta redaktora kopīga darbība. Ja programma ļauj saglabāt konfigurācijas failu diskā, tad to var izmantot pilnīgi autonomi. Visas programmas ļauj attēlā atzīmēt trīs galveno veidu apgabalus - taisno, apli un poli. Daži redaktori atbalsta noklusējuma veidu. Iespējams, vienīgais kritērijs attēlu karšu rediģēšanas programmas izvēlei ir tās lietošanas vienkāršība, jo visām programmām ir ļoti līdzīgas funkcionālās īpašības. Ja programmas saskarne jums šķiet neērta, varat pārtraukt tās lietošanu un izvēlēties citu.

Apskatīsim dažas no esošajām programmām.

MapEdit programma

Viena no vienkāršākajām un slavenākajām konfigurācijas failu rediģēšanas programmām ir utilīta MapEdit, ko izstrādājis Thomas Boutell. Šī programma pastāv jau vairākus gadus un ir ieviesta dažādām platformām. Jo īpaši ir versijas Windows 3.x un Windows 95/98/NT. Tāpat kā lielākajai daļai programmu, šai utilītai bija vairākas versijas. Pašlaik jaunākā operētājsistēmai Windows 95/98/NT pieejamā versija ir versija 2.6 (1999. gada septembris). Informāciju par programmu var iegūt:

http://www.boutell.cora/mapedit/

MapEdit ir koplietošanas programma, un tai ir 30 dienu novērtēšanas periods, pēc kura ir nepieciešama reģistrācija. Programma ir maza izmēra - izplatīšana aizņem apmēram 300 KB, un tajā pašā laikā tai ir gandrīz visas nepieciešamās iespējas.

Programma ļauj rediģēt konfigurācijas failus gan servera versijai (NCSA un CERN formātos), gan klienta versijai. Ir iespējams vizuāli izveidot aktīvās zonas taisnstūru, apļu un daudzstūru formā, kā arī noteikt saites adresi noklusējuma apgabalam.

Īsi apskatīsim šīs programmas galvenās funkcijas. Pēc MapEdit palaišanas parādās galvenais logs, kurā ir uzplaiksnījuma ekrāns (6.3. att.) un izvēlne. Ir iespējams rediģēt esošos failus gan servera, gan klienta attēlu karšu versijām. Ir iespējams arī izveidot jaunu konfigurācijas failu, taču tas attiecas tikai uz servera versiju. Klienta versijai ir nepieciešams avota HTML fails ar saitēm uz iegultiem attēliem, kas tiks izmantoti kā atsauce attēlu kartēm.

Piezīme

Nespēju izveidot jaunu HTML failu, izmantojot MapEdit, var viegli apiet. Lai to izdarītu, programma jāpalaiž faila izveides režīmā vienā no servera puses formātiem (NCSA un CERN), jāveic visas nepieciešamās darbības un pēc tam jāsaglabā rezultāti režīmā Saglabāt kā, norādot klienta sānu kartes formātu. Tiks izveidots HTML fails, kuru vēlāk varēs izmantot kā gatavu HTML dokumenta fragmentu.

Pieņemsim, ka mums ir jāizveido jauns konfigurācijas fails attēlu karšu servera versijai. Izvēlnē atlasiet Atvērt/Izveidot karti

Fails. Parādīsies dialoglodziņš (6.4. att.), kurā jānorāda veidojamā konfigurācijas faila nosaukums (piemēram, Blazons.map), jānorāda esošs attēla fails un izveidotā faila formāts (NCSA vai CERN). ). Attēla fails var būt GIF, JPG vai PNG formātā.

Rīsi. 6. 3 . MapEdit uzplaiksnījuma ekrāns

Rīsi. 6. 4 . Atvērt/Izveidot karti dialoglodziņš konfigurācijas faila izveidei

Piezīme

Daudzām servera puses konfigurācijas failu interpretācijas programmām ir nepieciešams, lai failam būtu MAP paplašinājums. Ieteicams vienmēr ievērot šo noteikumu.

Programma ielādēs izvēlēto attēla failu, uz kura būs iespējams atzīmēt aktīvās zonas (6.5. att.).

Lai to izdarītu, ir jāizvēlas aktīvā apgabala forma - taisnstūris, aplis vai taisnstūris, noklikšķinot uz atbilstošās ikonas vai izvēloties vajadzīgo vienumu izvēlnē Rīki (6.6. att.).

Turpmākās darbības tiek veiktas tieši uz attēla, atzīmējot punktus ar peli. Taisnstūra laukumam ir atzīmēts augšējais kreisais un apakšējais labais stūris, apļveida apgabalam - centrs un viens no apļa punktiem, daudzstūrim ir norādītas tā virsotnes. Piemēram, attēlā. 6.5. attēlā parādīts gadījums, kad uz attēla jau ir atzīmēti trīs dažādu formu aktīvie apgabali. Ņemiet vērā, ka līnijas, kas ierobežo aktīvos apgabalus, kalpo tikai to vizualizācijai, strādājot redaktorā, un nekādā veidā nemaina attēla failu. Attēlā šajā piemērā būtībā ir trīs atsevišķi attēli (attēloti Sanktpēterburgas, Tomskas un Jakutskas pilsētu ģerboņi), kas parasti nav raksturīgi reālistiskiem attēliem. Tomēr attēliem, kas satur, piemēram, vadības pogu komplektu, šī situācija ir diezgan tipiska.


Rīsi. 6. 5 . Attēls ar atzīmētiem dažāda veida tīklājiem

Rīsi. 6. 6 . Rīku izvēlne

Rīsi. 6. 7 . Objekta URL dialoglodziņš, lai norādītu URL un neobligātu komentāru

Pēc kāda no apgabaliem atzīmēšanas jānorāda šim apgabalam atbilstošā saites adrese, kā arī komentāru informācija (6.7. att.). Apgabalam var iestatīt noklusējuma saites adresi, kas tiks realizēta tai attēla apgabala daļai, kas neietilpst nevienā no aktīvajiem apgabaliem (6.8. att.).

Pēc laukumu atzīmēšanas varat vizuāli apskatīt vai mainīt izveidotos aktīvos apgabalus, izmantojot izvēlnes Rediģēt vienumu Pārbaudīt. Pēdējā darbība ir rezultātu saglabāšana kā konfigurācijas fails (Saglabāt vienumu izvēlnē Fails). Var izmantot arī vienumu Save As, kurā norādāt nepieciešamo formātu faila saglabāšanai (6.9. att.).

Rīsi. 6. 8 . Noklusējuma URL dialoglodziņš tvēruma noklusējuma URL iestatīšanai

Rīsi. 6. 9 . Saglabāt kā komandu dialoglodziņš

Piezīme

Vecākās MapEdit versijās bija neliela kļūda, kas saistīta ar saglabātā konfigurācijas faila formāta iestatīšanu. Ja, veidojot failu, tika norādīts CERN formāts, tad, saglabājot datus Saglabāšanas režīmā, fails joprojām tiks saglabāts NCSA formātā. CERN formāta failu ir iespējams izveidot tikai izmantojot režīmu Saglabāt kā un norādot nepieciešamo formātu.

Šajā piemērā tiks izveidots fails ar nosaukumu Blazons.map, kas satur šādu informāciju (NCSA formāts):

#Tomskas pilsētas ģerbonis

rekts www.ifmo.ru/sergeev/tomsk.htm 35.58 187.244

#Jakutskas pilsētas ģerbonis

aplis www.ifmo.ru/sergeev/jakutsk.htm 364.150 468.150

#Sanktpēterburgas pilsētas ģerbonis

poli www.ifmo.ru/sergeev/Spb.htm 537,61 700,61 700,230 618,256 537,231

Tie paši dati, ko redaktors saglabājis CERN formātā, izskatīsies šādi:

taisnais (35.58) (187.244) www.ifmo.ru/sergeev/tomsk.htm circle (364.150) 104 www.ifmo.ru/sergeev/jakutsk.htm poli (537.61) (700.61) (700.230) (618) 35, 618,2 www.ifmo.ru/sergeev/Spb.htm

Lūdzu, ņemiet vērā, ka komentāri šajā formātā nav atļauti, tāpēc šī informācija tiks zaudēta, kad fails tiks saglabāts.

Apskatīsim uzdevumu izveidot attēlu kartes klienta versiju. Lai atrisinātu šo problēmu, jums ir jābūt HTML avota failam, kurā ir vismaz viens iegultais attēls. Šo avota failu var izveidot iepriekš ar jebkuru teksta redaktoru vai īpašu HTML redaktoru. Pieņemsim, ka ir fails ar nosaukumu CSIM.HTM, kas satur šādu kodu:

Šis fails jāatver MapEdit redaktorā (6.10. att.). Atšķirībā no opcijas, kurā tika izveidots konfigurācijas fails, šeit nav nepieciešams norādīt attēla faila nosaukumu izvēlnes punktā Atvērt/Izveidot karti.

Rīsi. 6.1 0 . Atvērt/Izveidot karti dialoglodziņš esoša HTML faila atvēršanai

Rīsi. 6.1 1 . Atlasiet iekļautā attēla dialoglodziņu

Pēc avota HTML faila atvēršanas redaktors parādīs dialoglodziņu ar visu iebūvēto attēlu sarakstu, no kura jāizvēlas sev vajadzīgā (6.11. att.). Protams, failam ar izvēlēto attēlu ir jābūt.

Turpmākais darbs pie aktīvo zonu marķēšanas ir pilnīgi identisks iepriekšējam gadījumam. Pēc iezīmēšanas rezultātu saglabāšanas avota fails tiks mainīts, un dotajā piemērā tas izskatīsies šādi:

Tomskas pilsētas ģerbonis

href="tomsk.htm">

Jakutskas pilsētas ģerbonis

href="jakutsk.htm">

Sanktpēterburgas pilsētas ģerbonis

coords="537,61,700,61, 700, 230, 618, 256, 537,231" href="Spb.htm">

Lūdzu, ņemiet vērā, ka redaktors automātiski piešķir attēlu kartes nosaukumu, kas atbilst atsauces attēla faila nosaukumam. Šajā piemērā fails ar attēlu tika nosaukts Blazons.gif, tātad taga nosaukuma parametrs<тар>tika piešķirta vērtība "Blazons".

Piezīme

MapEdit redaktors nedarbojas gluži pareizi ar krievu alfabēta rakstzīmēm. Daži krievu burti pazūd, kad fails tiek saglabāts, un to vietā parādās atstarpes. Vienkāršākā izeja no šīs situācijas ir krievu valodas teksta pievienošana pēc darba pabeigšanas redaktorā.

Kartē ŠO!

Vēl viena utilīta attēlu karšu konfigurācijas failu izveidei un rediģēšanai ir programma Map THIS, par kuru informāciju var iegūt:

http://galadriel.ecaetc.ohio-state.edu/tc/mt/.

Darbs ar šo programmu idejiski ir līdzīgs MapEdit programmai. Pamats darbam ar programmu ir aktīvo apgabalu vizuālais noformējums ar turpmāku rezultātu saglabāšanu failā kādā no izvēlētajiem formātiem. Redaktors atbalsta gan servera, gan klienta puses attēlu karšu formātus (NCSA un CERN). Attēlus var ielādēt no GIF un JPG failiem.

Šeit ir šīs programmas izveidoto konfigurācijas failu piemēri. Iepriekšējā sadaļā sniegtajā piemērā NCSA formātā saglabātais fails izskatītos šādi:

#$MTIMFH

#$-:Attēla kartes fails, ko izveidoja Map THIS!

#$-: Kartē ŠO! Toda C. Vilsona bezmaksas attēlu karšu redaktors

#$-: Lūdzu, nerediģējiet rindas, kas sākas ar "#$"

#$VERSION:1.30

#$TITLE: Blazons

#$DESCRIPTION: attēla kartes servera versija

#$DATE: Otrdiena, 14. septembris, 12:10:42 1999

#$PATH:C:\Program Files\Mapthis\

#$GIF: Blazons.gif

#$FORMAT:ncsa

#$EOH

noklusējuma default.htm

# Tomskas pilsētas ģerbonis

rect Tomsk.htm 33,60 191,246

# Jakutskas pilsētas ģerbonis

aplis Jakutsk.htm 366 147 366 256

# Sanktpēterburgas pilsētas ģerbonis

poli Spb.htm 534,62 699,62 698,236 626,261 534,235 534,62

Atšķirībā no programmas MapEdit, šis redaktors izvades failā ieraksta diezgan daudz komentāru informācijas, tostarp īsu informāciju par pašu programmu, faila izveides datumu utt. Turklāt aiz simbola #, kas nozīmē komentāra sākumu rindā, redaktors komentāru rindām pievieno simbolu $, ko veidojis pats redaktors. Pievērsiet uzmanību iepriekš minētā koda ceturtajai rindiņai, kurā tiek lūgts nerediģēt redaktora ievietotos komentārus.

Tas pats piemērs, kas saglabāts CERN formātā, izskatītos šādi:

taisnais (4096,4096) (4096,4096) mt:#$MTIMFH

rect (4096,4096) (4096,4096) mt:#$-:Attēla kartes fails, ko izveidoja Map THIS!

rect (4096,4096) (4096,4096) mt:#$-:Kartē ŠO! bezmaksas attēlu karšu redaktors

autors Tods C. Vilsons

rect (4096,4096) (4096,4096) mt:#$-:Lūdzu, nerediģējiet rindas, kas sākas

ar "#$"

rect (4096,4096) (4096,4096) mt:#$VERSION:1.30

rect (4096,4096) (4096,4096) mt:#$TITLE: Blazons

rect (4096,4096) (4096,4096) mt:#$DESCRIPTION: Servera versija

attēlu kartes

taisnais (4096.4096) (4096.4096) mt:#$

rect (4096,4096) (4096,4096) mt:#$DATE: Otrdiena, 14. septembris, 12:10:42 1999

rect (4096,4096) (4096,4096) mt:#$PATH:C:\Program Files\Mapthis\

rect (4096,4096) (4096,4096) mt:#$GIF:Blazons.gif

rect (4096,4096) (4096,4096) mt:#$FORMAT:cern

taisnais (4096,4096) (4096,4096) mt:#$EOH

noklusējuma default.htm

rect (4096,4096) (4096,4096) mt:# Tomskas pilsētas ģerbonis

taisnstūris (33.60) (191.246) Tomsk.htm

rect (4096,4096) (4096,4096) mt:# Jakutskas pilsētas ģerbonis

circ (366 147) 109 Jakutsk.htm

rect (4096,4096) (4096,4096) mt:# Sanktpēterburgas pilsētas ģerbonis

daudzstūris (534.62) (699.62) (698.236) (626.261) (534.235) (534.62) Spb.htm

Kā redzams no iepriekš minētā koda, redaktors izmanto zināmā mērā mākslīgu paņēmienu, lai saglabātu komentārus gan lietotāja ievadītos, gan pašas programmas ģenerētos. Atgādināsim, ka CERN formāts neļauj norādīt komentāru rindas, tāpēc redaktors izveido rindiņu kā

taisnais (4096 4096) (4096 4096),

kura beigās varat ievietot jebkuru tekstu. Būtībā šāda līnija apraksta taisnstūri, kas acīmredzami atrodas ārpus ekrāna, tāpēc tā klātbūtnei nav nozīmes. Protams, šajā gadījumā konfigurācijas faila teksts kļūst daudz apgrūtinošāks un lasāmāks, kas gan netraucē programmu darbībai. Šo komentāru saglabāšanas paņēmienu var izmantot.

Tas pats piemērs, kas saglabāts kā HTML fails (attēlu karšu klienta versijai), izskatīsies šādi:

<МАР NAME="Blazons">

ALT="Tomskas pilsētas ģerbonis"> !}

ALT="Jakutskas pilsētas ģerbonis"> !}

HREF="Spb.htm" ALT="Sanktpēterburgas pilsētas ģerbonis"> !}

Šeit atšķirībā no programmas MapEdit attēla kartes nosaukums ir jānorāda manuāli, tāpēc tas var nesakrist ar faila nosaukumu ar atsauces attēlu.

CrossEye programma

CrossEye konfigurācijas failu redaktora programma, ko izveidojusi slavenā Austrālijas kompānija Sausage Software. Šo programmu atzinīgi novērtēs populārā HTML redaktora HotDog cienītāji, jo to izveidoja tas pats uzņēmums un tai ir ļoti pievilcīgs, humoristisks interfeiss.

Informāciju par CrossEye paketi var iegūt:

http://www.sausage.com.au.

Programmas atšķirīgās iezīmes ir diezgan lielais izplatīšanas komplekta izmērs (apmēram 2,5 MB), kā arī īss laika periods (14 dienas), kurā to var izmantot novērtēšanas režīmā. Liels izmērs programmas ir raksturīgas visam programmatūra, ko izveidojusi Sausage Software, kas acīmredzot saistīts ar izstrādei izmantoto rīku izvēli (Visual Basic).

Diemžēl programmai nav vairāku nepieciešamo rekvizītu. Piemēram, nav iespējams nolasīt esošu HTML failu, tāpēc nav iespējams rediģēt esošu attēlu karti, kas tika izveidota agrāk. Tāpat nav iespējams tieši saglabāt savu darbu HTML failā. Rezultātu saglabāšana iespējama tikai failā ar speciālu paplašinājumu EYE, kuram ir bināra forma un ko turpmāk varēs izmantot tikai šajā redaktorā. Ģenerētais HTML kods tiek ierakstīts Windows starpliktuvē, no kurienes to var kopēt uz jebkuru teksta redaktoru.

Tāpat kā visos iepriekš aprakstītajos redaktoros, aktīvo apgabalu izveide un rediģēšana tiek veikta tieši uz attēla, bet attēls tiek ielādēts logā, kura izmēru nezināmu iemeslu dēļ nevar mainīt. Ja attēls ir lielāks par logu, varat ritināt, lai skatītu attēlu, bet nevar iestatīt aktīvo apgabalu, kas sniedzas ārpus skata loga.

Klienta puses attēlu kartei redaktors vispār neprasa iestatīt noklusējuma URL apgabalam. To var izdarīt ar nolūku, jo ne visas pārlūkprogrammas atbalsta noklusējuma apgabala veidu. Tomēr iepriekš aprakstītie redaktori šo problēmu atrisina ļoti eleganti, automātiski aizstājot noklusējuma apgabalu ar taisnstūrveida laukumu, kura izmēri ir vienādi ar attēla izmēriem.

Trūkumi savā ziņā tiek kompensēti ar noteiktiem redaktora papildu līdzekļiem. Jo īpaši jūs varat uzzināt, ka papagailis, kas redzams augšējā attēla augšējā labajā stūrī, tiek saukts par Polliju. Viņš ir diezgan runīgs, un lietotāji strādā pie datora, kas aprīkots ar skaņas karte, ik pa laikam atskanēs papagaiļa izsaucieni, kuriem gan nav nekāda sakara ar veicamajām darbībām. Un vienā no dialoglodziņi Redaktora iestatījumos pat ir īpašs vienums, kas ļauj aizbāzt nabaga papagaiļa muti. Šeit ir augstākās klases pakalpojuma piemērs. Acīmredzot, pateicoties uzskaitītajiem rekvizītiem, tiek lēsts šī redaktora vērtējums http://www.tucows.com, ir ļoti augsts, ko nevar teikt par divām iepriekš aprakstītajām programmām.

Galu galā redaktora izvēle attēlu karšu izveidei ir lietotāja ziņā.

Pros

  • Attēlu kartes ļauj definēt jebkuru atsauces apgabala formu, kas ir īpaši noderīga, lai norādītu ģeogrāfisko apgabalu. Tāpēc attēlu kartes visbiežāk izmanto ģeogrāfiskajos apgabalos.
  • Ērtāk ir strādāt ar vienu attēlu - griežot nav jāuztraucas par atsevišķu fragmentu savienošanu, un attēlu var viegli novietot pareizajā vietā.

Mīnusi

  • Ja saites apgabalam ir sarežģīta forma, HTML koda apjoms palielinās. Kontūra tiek tuvināta ar taisnu segmentu kopu katram šāda segmenta punktam, jānorāda divas koordinātas, un kopējais šādu punktu skaits var būt diezgan liels.
  • Attiecīgi palielinās koordinātu norādīšanas sarežģītība. Nav ērti tos norādīt manuāli, tāpēc jums ir jāizmanto īpašas programmas, kas vizuāli parāda apgabalus un ļauj tos rediģēt.
  • Mainot attēlu, piemēram, palielinot mērogu, jums būs atkārtoti jāiestata visu atskaites apgabalu koordinātas.
  • Attēlu kartēm, kas ir pieejamas, sagriežot vienu attēlu fragmentos, nevar izmantot dažādus efektus: ritināšanas efektu, daļēju animāciju, attēlu individuālu optimizāciju ātrai ielādei.
  • Nav skaidri definētu saišu robežu. Tāpēc šīs robežas ir jāizceļ, izmantojot dažādus līdzekļus tieši attēlā. Ja attēls kāda iemesla dēļ netiek ielādēts, tad saišu kopas izpratne kļūst ļoti problemātiska.

No lietotāja ērtības viedokļa attēlu kartēm ir tikai viena priekšrocība - dažādu formu saišu iekļaušana. Tas papildina informācijas pasniegšanas skaidrību - mēs neaprobežojamies ar saites taisnstūra formu un varam izmantot sarežģītas konfigurācijas saites saviem mērķiem.

Attēlu kartes ir ieviestas divās daļās dažādas iespējas- serveris un klients. Izmantojot servera opciju, pārlūkprogramma nosūta serverim pieprasījumu iegūt izvēlētās saites adresi un gaida atbildi ar nepieciešamo informāciju. Šī pieeja prasa papildu laiku, lai gaidītu rezultātu un atsevišķi faili katrai attēla kartei.

Klienta versijā karte atrodas tajā pašā HTML dokumentā, kur saite uz attēlu. Lai norādītu, ka attēls ir karte, izmantojiet elementa atribūtu usemap . Vērtība ir rādītājs uz kartes konfigurācijas aprakstu, kas tiek iestatīts, izmantojot elementu . Nosaukuma atribūta vērtība ir jāatbilst nosaukumam lietošanas kartē. Šajā gadījumā usemap vērtība sākas ar hash simbolu (1. piemērs).

1. piemērs: attēla kartes izveide

Attēlu karte

Informācija Pasākumi Nozares Tehniskā informācija Izglītība Darbs Dažādi

Konteinera iekšpusē atrodas viens vai vairāki elementi , tie norāda apgabala formu, tā koordinātas, nosaka dokumenta adresi, uz kuru jāveido saite, kā arī rīka padomu.

Elements ir šādi atribūti.

Aplim ir norādīti trīs skaitļi - apļa centra koordinātas un rādiuss.

© 2024 ermake.ru - Par datoru remontu - Informācijas portāls