Skip to main content

Stavět mapování obrázků bez editoru obrázkových map

The Jak Trilogy Analysis | Naughty Dog's Renegade Platformer (Smět 2024)

The Jak Trilogy Analysis | Naughty Dog's Renegade Platformer (Smět 2024)
Anonim

Obrázkové mapy jsou vzrušující a zajímavý způsob, jak oživit váš web - s nimi můžete nahrávat obrázky a dělat části těchto obrázků kliknutím na jiné online prostředky. Pokud máte špetku a nechcete stahovat editor obrázkových map, vytváření mapy pomocí značek HTML je jednoduché.

Budete potřebovat obrázek, editor obrázků a nějaký editor HTML nebo textový editor. Většina editorů obrázků vám ukáže souřadnice myši při orientaci na obrázku. Tato data koordinace jsou vše, co potřebujete, abyste mohli začít s obrazovými mapami.

Vytvoření obrazové mapy

Chcete-li vytvořit mapu obrázků, nejprve vyberte obrázek, který bude sloužit jako základ mapy. Obraz by měl být "normální velikost" - to znamená, že byste neměli používat obrázek tak velký, že prohlížeč ho změní.

Když vložíte obrázek, přidáte další atribut, který identifikuje souřadnice mapy:

Koťata!

Při vytváření obrazové mapy vytváříte oblast, na kterou lze kliknout, takže souřadnice souřadnic mapy se musí vyrovnat s výškou a šířkou zvoleného obrázku. Mapy podporují tři různé typy tvarů:

  • rect-obdélník nebo čtyřstranný obrázek
  • poly-mnohoúhelník nebo vícestranné číslo
  • kruh - kruh

Chcete-li vytvořit oblasti, musíte izolovat konkrétní souřadnice, které hodláte mapovat. Mapa může sestávat z jedné nebo více definovaných oblastí na obrázku, které při kliknutí otevře nový hypertextový odkaz.

Pro obdélník , mapujete pouze levý horní a dolní pravý roh. Všechny souřadnice jsou uvedeny jako x, y (přes, nahoru). Takže pro levý horní roh 0,0 a pravý dolní roh 10,15 zadejte 0,0,10,15. Pak jej vložíte do mapy:

Pro polygon , mapujete každý x, y koordinovat samostatně. Webový prohlížeč automaticky připojuje poslední sadu souřadnic s prvním; cokoliv uvnitř těchto souřadnic je součástí mapy.

Kruh tvary vyžadují pouze dvě souřadnice, jako je obdélník, ale pro druhou souřadnici určíte rádius nebo vzdálenost od středu kružnice. Takže pro kruh se středem 122,122 a poloměrem 5 byste psali 122,122,5:

Všechny oblasti a tvary mohou být zahrnuty do stejné značky mapy:

Úvahy

Obrazové mapy byly mnohem častější v éře Web 1.0 v devadesátých letech minulého století na velmi brzy 2000-obrazové mapy často tvořily základ navigace webu. Návrhář by vytvořil nějaký obrázek, který by označoval položky nabídky, a poté nastavil mapu.

Moderní přístupy podporují citlivý design a používají kaskádové styly pro řízení umístění obrázků a hypertextových odkazů na stránce.

Přestože značka mapy je stále podporována v normě HTML, použití mobilních zařízení s malými formovými faktory může vést k neočekávaným problémům s obrazovými mapami. Navíc problémy s šířkou pásma nebo poškozené obrázky ovlivňují hodnotu obrazové mapy.

Takže neváhejte pokračovat v používání této stabilní a dobře srozumitelné technologie - věděte, že v současné době existují efektivnější alternativy en vogue s webovými designéry.