Imagens
Clicáveis
Existem basicamente dois métodos para a criação de mapas. Um deles, o Server-Side
Imagemap, utiliza a comunicação com o servidor HTTP. Nesse método, o
documento HTML busca informações em outros arquivos (geralmente de extensão .map ou
.conf). Dentro desses arquivos estão as coordenadas e os links a elas relacionados.
No outro método (Client-Side Imagemap), essas coordenadas são
declaradas dentro do arquivo HTML, e por isso são rastreadas pelo browser no momento em
que o usuário escolhe um ponto na imagem. Dessa forma, o servidor já recebe uma
requisição de um documento, pois as coordenadas do ponto escolhido e o arquivo
correspondente já foram identificados pelo browser.
Essas coordenadas são encontradas, através de programas de manipulação de imagens
como por exemplo o LView. Existem também programas que geram automáticamente essas
coordenadas e atribuem a elas o endereço URL que você estipular. Um desses programas é
o MapThis.
Ele permite que você selecione a área desejada através das ferramentas circulo,
retângulo ou polígono e indique o endereço a qual aquela área esta relacionada. Depois
ele cria automáticamente o documento-fonte no formato em que vôce preferir.
Como já mensionamos antes, neste último método, o mapa é declarado dentro do
documento HTML. O conjunto de comando responsáveis pela criação deste mapa estão
exemplificados abaixo:
<MAP NAME="mapa">
<area href="ex1.html" shape="rect" coords="7, 3, 86, 65">
<area href="ex2.html" shape="circle" coords="210, 33, 33">
<area href="ex3.html" shape="rect" coords="369, 2, 435, 62">
</map>
<img border="0" src="imagem.jpg" usemap="#mapa">
Neste exemplo, usamos a opção rect e circle no comando AREA SHAPE, mas existe ainda a opção
POLY: um polígono; cada coordenada declarada é um
vértice;
No exemplo as coordenadas declaradas são, respectivamente, do vértice esquerdo
superior e vértice direito inferior de um retângulo. O resultado seria o mapa clicável
abaixo:
|