HTML grafik kartalari. Rasm xaritasi Sichqoncha

Qo'llab-quvvatlash brauzerlari

Atributlar

Foydalanish namunasi

Keling, bitta rasmda ma'lum bir rasmni bosganda, ushbu raqamlarni tavsiflovchi turli veb-sahifalar (Vikipediyaga havolada) turli xil veb-sahifalarga o'tish bor.

Shaklni tanlang:

"4 raqam tanlash uchun mavjud"

Xo'sh, biz bu misolda qilgan ishimiz uchun:

Ushbu maqolada biz ma'lum bir sohani bosganingizda, biz ma'lum bir sohani bosganingizda, biz ma'lum bir turdagi havolani bosishingiz mumkin. Xaritalar xaritalarida kamdan-kam hollarda saytlarda topish mumkin, chunki bu jarayon juda ko'p vaqt talab qilinishi mumkin, ammo agar siz o'z tashrif buyuruvchilarni g'ayrioddiy shaklda ajablantirsangiz va siz o'zingizning ta'lim uchun bo'sh vaqtingiz bor, keyin ushbu maqola siz uchun.

Yorliq

Foydalanish namunasi

Keling, bitta rasmda ma'lum bir rasmni bosganda, ushbu raqamlarni tavsiflovchi turli veb-sahifalar (Vikipediyaga havolada) turli xil veb-sahifalarga o'tish bor.

Shaklni tanlang:

"4 raqam tanlash uchun mavjud"

Xo'sh, biz bu misolda qilgan ishimiz uchun:

tez: Rasm koordinatlarini olish uchun, masalan, rasm muharriridan foydalaning, masalan, masalan, Bo'yamoq.Kursorning koordinatalarini ko'rsatadi. Koordinatalarni varaqda yoki alohida faylda yozing va sahifada qiymatlarni qiling.

Agar siz vazifani bajarishda qiyinchiliklarga duch kelsangiz, unda alohida oynada misolni ochib, sahifada kodni tekshiring va diqqat bilan o'qing.

Vlad Merzehevich

Rasm kartalari sizga bitta rasmning turli sohalariga bog'lanishingizga imkon beradi. U ikki xil versiyada amalga oshiriladi - server va mijoz. Agar server qo'llanilsa, tanlangan havolani hal qilish uchun brauzer serverga so'rov yuboradi va kerakli ma'lumotlarni javob kutmoqda. Ushbu yondashuv har bir rasm kartasi uchun natija va individual fayllarni kutish uchun qo'shimcha vaqt talab qiladi.

Mijoz versiyasida xaritaning rasmga havolasi bo'lgan HTML hujjatida joylashgan.

Mijoz rasm guvohnomasi

Rasm xaritani belgilash uchun USMAP yorlig'idagi atributdan foydalaning . Qiymat xaritaning konfiguratsiyasining tavsifiga havolani ko'rsatadi.

Masalan 1. Xarita rasmidan foydalanish

Ushbu rasm xaritada ekanligini brauzerni aniqlash uchun USEMAP atributi qo'llaniladi. Bu teg bilan belgilangan karta konfiguratsiyasining konfiguratsiyasiga tegishli

Atributlar tegi maydoni.

shakl

Faol mintaqaning shaklini belgilaydi. Shakl birlashma shaklida (aylana), to'rtburchaklar (to'g'ri), ko'pburchak (pol).

alt.

Har bir hudud uchun muqobil matn qo'shadi. Bu faqat ma'lumot uchun sharh beradi, chunki ekran ko'rsatilmagan.

cobigerlar.

Faol maydonning koordinatalari belgilanadi. Koordinatalar 0,0 ga to'g'ri keladigan rasmning yuqori chap burchagidan pikselda hisoblanadi. Birinchi raqam - gorizontal koordinata, ikkinchisi vertikal. Koordinatalar ro'yxati mintaqaning shakliga bog'liq.

Doira uchun uchta raqam - aylana markazi va radiusning koordinatalari o'rnatiladi.

To'rtburchaklar uchun - chap yuqori va o'ng pastki burchakning koordinatalari.

Ko'pburchaklar uchun uning uchlari koordinatalari o'rnatiladi (2-rasm).

Anjir. 2. Poligon uchun ish joylarini muvofiqlashtiradi

xref.

Rasm kartalari sizga bitta rasmning turli sohalariga havolalarni yaratishga imkon beradi. Ushbu yondashuvdan foydalanib, oddiy matnli havolalarga qaraganda aniqlanadi va fayllarni tashkil qilish uchun faqat bitta grafik faylni qo'llash imkonini beradi. Biroq, karta rasmlari grafik havolalar kerak bo'lgan hamma joyda kiritilishi kerak deb taxmin qilish shart emas. Avvalo, siz qarshi bo'lgan barcha dalillarni, shuningdek alternativ variantlarni ko'rishingiz kerak.

Kartalarning afzalliklari

1. Kartalar sizga biron bir ma'lumot maydonini belgilashga imkon beradi. Tabiatlarning tabiatlari bo'yicha tasvirlar, masalan, murakkab shaklning grafik yo'nalishini hisobga olsak, kayfiyatli rasmlarsiz geografik hududni ko'rsatishni anglatadi. Qoida tariqasida, xarita tasvirining geografik mavzularida va eng tez-tez qo'llang.

2. Bitta fayl bilan ishlash uchun ko'proq qulay bo'lsa - siz individual bo'laklarni sotib olishni va rasmni osonlikcha kerakli joyga joylashtirishingiz mumkin.

Kamchiliklari

1. Individual hududlar uchun siz pop-up va muqobil matnni o'rnatolmaysiz. Muqobil matn sizga brauzerda tasvirni yuklash o'chirilganda rasm haqida matnli ma'lumotlarni olish imkonini beradi. Tasvirlar yuklanganidan beri bu haqda ma'lumot brauzerini olgandan so'ng, almashtirish naqshlari avval ko'rinadi. Va yuk ko'tarilganidek, matn rasm bilan almashtiriladi. Kartalar uchun bu xususiyat muhim, chunki agar siz ko'plab foydalanuvchilarning bajaradigan rasmlarni ko'rishni o'chirib qo'ysangiz, biz oxir-oqibat bitta bo'sh to'rtburchakni ko'ramiz.

2. Murakkab shaklda ma'lumot maydoni HTML kod miqdorini oshiradi. Kontur, bunday segmentning har bir nuqtasiga ikkita koordinatalar o'rnatilishi kerak va bunday nuqtalarning umumiy soni juda katta bo'lishi mumkin. Adolatli ekanligi ta'kidlanishi kerakki, murakkab shakllar alohida holatdir va kamdan-kam hollarda qo'llaniladi.

3. Kartalar, rasmlar bilan rasmlar uchun turli xil ta'sirlarni amalga oshirish mumkin emas: Rolling effekti, qisman animatsiya, tez yuklash uchun rasmlarning individual optimallashtirish.

Yoyilmaslik

Foydalanuvchi qulayligining nuqtai nazaridan, kartani rasmlar faqat bitta ustunlikka ega - turli xil shakldagi ma'lumotnomalarga ega. Bu ma'lumot taqdimotiga aniqlik kiritadi - biz ma'lumotning to'rtburchaklari bilan cheklanmaymiz va ularning maqsadlari uchun murakkab konfiguratsiya ma'lumotnomalaridan foydalanishingiz mumkin. Ulardan boshqa barcha munosabatlarda hech qanday foyda yo'q - odatdagi matnli aloqalar yanada mazmunli va brauzerdagi rasmlarni namoyish etish juda qo'rqinchli emas. Bitta rasm bir xil rasmga qaraganda tezroq yuklangan, ammo parchalarga maydalangan va grafik fayllar shaklida saqlangan. Ushbu oxirgi fayllarning har biri individual optimallashtirish sozlamalari yordamida kamaytirilishi mumkin. Natijada barcha parchalarning umumiy hajmi bitta rasmdan kam joy egallaydi. Diskologik omil emas - kishi kichik rasmlar to'plami bir kattadan ko'ra tezroq yuklangandek tuyuladi.

Asosiy kamchilik kartalari aniq bag'ishlangan chegaralar emas. Shuning uchun, bu chegaralar tasvirda turli xil vositalar tomonidan ajratilishi kerak. Agar rasm biron bir sababga ko'ra amalga oshirmasa, u murojaatlar to'plamida juda muammo bo'ladi.

Muqobil variantlar

Karta rasmlaridan foydalanish zarurati yo'q, shuning uchun vazifani bajarish uchun boshqa mumkin bo'lgan variantlar mavjudligiga e'tibor berishingiz kerak.

Flash-dan foydalanish.

Flash roliklar ichida siz vektorli grafikalardan foydalanib havolalarning turli xil havolalarini yaratishingiz mumkin. Keng imkoniyatlar tufayli siz Flash-da ajoyib menyu va navigatsiya vositalarini yaratishingiz mumkin. Ammo bu erda ham o'rmon daraxtlarini yo'qotmaslik kerak.

Rasmlarni kesish

Bu dizayndagi mashhur mablag'lardan biridir. Ushbu holatda bitta rasm bo'laklarni bo'laklarga ajratish uchun maxsus dasturlar orqali kesilgan, ular bir-biriga qisqartirilgan, qattiq rasmni keltirib chiqaradigan. Garchi kesish joylari faqat to'rtburchaklar bo'lishi mumkin bo'lsa-da, aksariyat hollarda bu ma'lumotlarni yaratish uchun etarli. Har bir parcha uchun siz saqlangan eng mos grafik formatni tanlashingiz, optimallashtirish variantlarini tanlashingiz mumkin, alternativ matnni qo'shing. Keyin rasmlar o'chirilgan bo'lsa ham, joylarning chegaralari va matn tasviri aniq ko'rinadi.

Qisqacha ma'lumot

Ma'lum bo'lishicha, xaritalar rasmlaridan foydalanishning sababi faqat bitta - dizayn vazifalari bilan tavsiflangan ma'lumotlarning murakkab shakli. Oddiy qo'llanma - ma'lumotnoma sifatida xizmat qiladigan geografik xaritaning hududlari. Boshqa barcha holatlarda siz matnli aloqalarni amalga oshirishingiz mumkin va agar siz grafik navigatsiya yaratishingiz kerak bo'lsa, qulaylik uchun bitta rasmni parchalash mumkin. Ushbu yondashuv foydalanuvchilarga ko'proq qulaylikni keltirib chiqaradi, ayniqsa turli sabablarga ko'ra brauzerdagi rasmlarning namoyishini uzing. Shuningdek, ular ular haqida eslashlari kerak.

"Men har xil veb-sahifalar (" ") ga havolalarni joylashtirish uchun ish joyini yasadim (" ")

Endi, agar siz yozuvlar bilan raqamlarni bossangiz, tegishli sahifalar ochiladi: Profil, Die yoki "Blorni WordPress" bo'limiga va uning o'zgartishlariga uzatilgandan so'ng, havolalar ishlamaydi! Ammo dars muhimligicha qolmoqda!)

Rasm ishlash uchun men bunday HTML-kod haqida yozdim:

Ushbu kodni xabar maydoniga kiritish mumkin («Manba» tugmasi bosilganda) yoki epigrafga ...

Aytgancha, mavzu bo'yicha boshqa xabarlar mavjud: "Html nima ","HTML kodeksi ","Havolasi "va boshqalar.

1. Koordinatalar

Belgilangan kodni tuzish uchun men bir oz geometriyani esladim :)

Koordinata tizimi: x o'q - yuqoridan pastga, y o'qi - chapdan o'ngga
Shaklning koordinatalarini belgilash uchun siz o'rnatishingiz kerak:
- uning tomonlari o'qlarga parallel bo'lgan kvadrat (yoki to'rtburchaklar) - x1, y1 va x2, y2-ning koordinatalari
- Poliqon - Barcha burchaklar koordinatalari
- aylana koordinatalari va radiusi.

Mening ishimda aylanadi, A, ballar koordinatalari "profil" (to'rtburchaklar), "kundalik" (ko'pgon), q va uzunlikdagi havola uchun R - "Photoshop darslari" (doiralar). HTML-koddagi barcha raqamlar qizil rangda ajratilgan. Bundan tashqari, siz rasmning o'lchamini pikselda (yashil) bilishingiz kerak

Maxsus aniqlikka ehtiyoj yo'q, shuning uchun koordinatalarni Photoshop-da "Line" yordamida aniqlash mumkin - uni qo'ng'iroq qilishga chaqirish Ctrl + R.

Men koordinatalarni hisoblash uchun boshqa birov uchun ko'proq qiziqdim. Ushbu ishga tushirish uchun Ms bo'yoq. (Boshlang'ich - Barcha dasturlar - Standard - bo'yoq) va unga rasm oching. Agar siz kursorni pastki paneldagi kerakli nuqtalarga ulaganingizda, ularning koordinatalari diqqat bilan yozib olishadi

2. HTML kod

Navigatsiya kartalari teg bilan o'rnatiladi

Teg xaritasi teglarni o'z ichiga oladi chizma va bog'langan ma'lumotlarning geometrik yo'nalishlarini aniqlaydi.

Men buni tushundim - navigatsiya kartasini yaratish uchun:

— rasm tavsifi bo'lgan teglar

— karta teglari

— teglar Teglar

Mening ishimda qadriyatlar quyidagicha bo'lingan:

• kenglik \u003d. "640" Balandlik \u003d. "367" - Rasmning o'lchamlari
• src \u003d "https: //ssilt/f02c73cd94.jpg" - saytdagi rasm manzili
• uSEMAP \u003d "# rasm " - Shartli tasvir kartasi nomi (ehtimol har qanday)
• xap nomi \u003d. "Rasm" - Xarita nomi (to'la yuqoridagilarga mos keladi)

Link yo'nalishlari uchun qiymatlar - HRE - HARE - Shaklning maqsadi - Muvofiqlik va koordlar - koordinatalar - rasmdagi uchta sohaga mos keladi.

"Profil" to'rtburchaklar

• hREF \u003d "HTTPS: // Sayt / Profil /" - Profil sahifa manzili
• shape \u003d "to'g'ri" - "to'rtburchak" shaklining belgisi
• coords \u003d "235,61,472,117" - A (235,61) va C koordinatalari (235.61) va C (472,117)

Ko'pburchak "kundalik"

• hREF \u003d "HTTPS: // Sayt / Blog" - Diala sahifasi manzili
• shape \u003d "Pyam" - "Polgon" shaklining belgisi
• coords \u003d "235,118 35,47,45,47,14,146" - Poytinlar koordinatalari: (235,118), g (474.152), g (457.152) va H (229,146)

"Photoshop darslari" doiralari

• hREF \u003d "https: //showJournal.php? Jurniy \u003d 2447247" - "Photoshop darslari" bo'limidagi xabarlar postlarining manzili
• shape \u003d "doira" - "doira" ni belgilash
• coords \u003d "551,198,65" - aylanuvchi koordinatalar: markaz - Q (551,198) va radius - r \u003d 65

3. tugatish

Navigatsiya xaritasi uchun HTML kodining "tizimi" dagi barcha olingan qiymatlarni to'ldirdi va quyidagilarni qabul qildi:

Aynan shu kod "burilish" rasmga havolali joylar bilan foydalanish.

O'qish uchun "engil" mavjud "Engil" oson va aloqalarni yaratishning oson versiyasi mavjud - Post "O'quv: Rasmdagi havolalar"

Agar siz xato topsangiz, iltimos, matnli bo'lakni tanlang va cherting Ctrl + Enter..