clicáveis executados pelo servidor (´server-side imagemaps´)
Um primeiro método para criação de mapas é usando a
comunicação com o servidor HTTP.
comunicação com o servidor HTTP.
Os servidores WWW têm um programa que lida com a
relação entre coordenadas de imagens e URLs. No servidor
NCSA, esse programa é o imagemap, no CERN é
o htimage. No servidor Apache, o módulo imagemap já vem embutido
mas sua ativação deve ser configurada.
relação entre coordenadas de imagens e URLs. No servidor
NCSA, esse programa é o imagemap, no CERN é
o htimage. No servidor Apache, o módulo imagemap já vem embutido
mas sua ativação deve ser configurada.
Escolhida a imagem que servirá de base de partida de diversos links
para outros documentos, é preciso gerar um arquivo relacionando
coordenadas da imagem a determinados links. Essas coordenadas são
encontradas por meio de programas de manipulação de
imagens ou pelo próprio editor de HTML.
Um arquivo .map (do servidor NCSA), tem o
conteúdo organizado da seguinte forma:
conteúdo organizado da seguinte forma:
forma | URL associado | coordenadas |
|---|---|---|
default | /nada.html | 15,8 135,39 |
Um arquivo .conf (do servidor CERN), tem o
conteúdo organizado da seguinte forma:
conteúdo organizado da seguinte forma:
forma | coordenadas | URL associado |
|---|---|---|
default | (15,8) (135,39) | /nada.html |
Ambos arquivos significam a mesma coisa:
1. a região da figura, compreendida pelo retângulo (
rect) de coordenadas (15,8) e (135,39), funciona como um link para o URL http://www.usp.br/;2. a região da figura, compreendida pelo círculo (
circle ou circ) de centro (306,204) e raio 7 é um link para o URL http://www.intermidia.icmc.usp.br/;3. se o mouse não for acionado em nenhuma dessas duas regiões previstas, o link será dirigido para o arquivo default - neste exemplo, o
nada.htmlO formato desses arquivos para figuras clicáveis pode variar, mas
basicamente contém esses mesmos elementos:
- default - indica um endereço
padrão para quando o mouse for acionado em uma área da
figura além das previstas pelo autor;
- circle ou circ - declara um
círculo na figura; os pontos indicam o centro e um ponto de
fronteira do círculo;
- poly - um polígono; cada coordenada declarada
é um vértice;
- rect - um retângulo; as coordenadas declaradas
são, respectivamente, do vértice esquerdo superior e
vértice direito inferior.
Tão logo seu arquivo fazclic.map esteja pronto,
seu mapa sensível deve ser declarado da seguinte maneira:
seu mapa sensível deve ser declarado da seguinte maneira:
<A HREF="http://www.host.br/fazclic.map"><IMG SRC="mapa.gif"
ISMAP></A>onde
- http://www.host.br/fazclic.map - é o
endereço para o arquivo.mapque contém as diretivas que associam
regiões da figura a referências WWW - mapa.gif - é a figura que irá
"funcionar" como mapa clicável
O servidor HTTP deve estar configurado para
reconhecer os arquivos .map como diretivas de execução de mapas
clicáveis, para fazer a correspondência entre as coordenadas de
um pixel e o caminho de um arquivo.
reconhecer os arquivos .map como diretivas de execução de mapas
clicáveis, para fazer a correspondência entre as coordenadas de
um pixel e o caminho de um arquivo.
Se essa configuração não estiver ativa, ou faltarem
arquivos que permitem esse recurso, o resultado
de se acionar o mouse sobre um mapa clicável será apenas o de se
obter o código
fonte do arquivo
será o endereço do arquivo
do pixel sobre o qual o mouse foi acionado.
arquivos que permitem esse recurso, o resultado
de se acionar o mouse sobre um mapa clicável será apenas o de se
obter o código
fonte do arquivo
.map; o URL desse resultado será o endereço do arquivo
.map, seguido pela coordenada do pixel sobre o qual o mouse foi acionado.
Exemplo de um arquivo mapa.map, para a figura
abaixo:
abaixo:
#Pagina da Graduacao
rect exemplos/grad.html 0,0 130,45
#Pagina do Mestrado
rect exemplos/mestr.html 133,0 230,45
#Pagina do Doutorado
rect exemplos/dout.html 234,0 364,45
Esta formatação declara a imagem acima
como
mapa clicável:
<A HREF="mapa.map"><IMG SRC="icones/cursos.gif" ISMAP
BORDER=0></A>Como nosso servidor não está configurado
para executar mapas, somente abaixo temos um exemplo ativo, executado
pelo cliente (o browser).
Mapas
clicáveis executados pelo cliente (´client-side imagemaps´)
Com o client-side imagemap, os mapas sensíveis são rastreados 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.
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.
Na verdade, a relação coordenadas-documentos continua existindo, mas agora em
vez de estar em um arquivo
.map separado, está dentro do próprio documento. Preste atenção ao conjunto de atributos necessários para que o mapa
funcione:
<MAP NAME="nomemapa">
<AREA SHAPE="forma1" HREF="arq1.html" COORDS="x1,y1,x2,y2"><AREA SHAPE="forma2" HREF="arq2.html" COORDS="x3,y3,x4,y4"></MAP>
<IMG SRC="imagem.gif" USEMAP="#nomemapa">
Neste exemplo, transformamos a barra abaixo em mapa sensível:
<map name="mapname">
<area shape="rect" href="exemplos/grad.html" COORDS="0,0,130,45">
<area shape="rect" href="exemplos/mestr.html" COORDS="133,0,230,45">
<area chape="rect" href="exemplos/dout.html" COORDS="234,0,364,45">
</map>
<img src="icones/cursos.gif" USEMAP="#mapname" border=0>
0 comentários:
Postar um comentário
Gostou do que encontrou aqui?
Comente este artigo que acabou de ler.
Quer entrar em contato ou tirar alguma dúvida? Formulário de Contato
Nos comentários dos artigos escreva apenas o que for referente ao tema.
Antes de Comentar leia nossa Política para Comentários para saber como interagir com nossos artigos, tirar suas dúvidas e ser respondido(a).