Como escoller o tamaño do mapa

26 septiembre 2008

O modelo carte_gis crea unha etiqueta div para conter o mapa e o código JavaScript que o xenera. Se queres introducir un mapa na parte pública da web, simplemente tes que chamalo a través dos esqueletos de Spip, escribindo a seguinte liña de código no lugar onde desexes poñer o mapa.

 
[(#MODELE{carte_gis}{id_carte_gis}{id_article}{id_rubrique}{id_mot}{id_auteur}{recherche}
{latit}{lonxit}{zoom}{type}{width}{height}{control})]

Aquí tes a ligazón ó artigo sobre este modelo no apartado para desenvolvedores:

carte_gis.html

Cando chames ó modelo carte_gis, poderás definir o ancho e o alto do mapa usando as variables width e height, xa que estas variables se utilizan para dar valor as propiedades width e height do estilo da etiqueta div.

 

Se non definines os valores de width e height, o modelo utilizará por defecto «100%» para o ancho do mapa e «400px» para o alto.

 

¿Como podemos evitar que o modelo carte_gis defina o estilo na etiqueta div do mapa?

Nalgunhas ocasións, é necesario dar formato ó mapa a través da CSS. Por exemplo, non se pode asignar directamente «100%» como valor do alto e do ancho para facer un mapa que ocupe toda a pantalla, xa que cando facemos isto o navegador falla e non logra amosalo. Para facer un mapa que ocupe toda a pantalla é necesario definir as propiedades do seu div a través da CSS dun xeito algo curioso; asignandolle unha posición absoluta e valores 0, 0, 0, 0 para as propiedades bottom, top, left e right.

Se pode utilizar unha variable chamada style e asignarlle o valor «non», para evitar que ó modelo defina o estilo da etiqueta div e así, poder definilo via CSS utilizando o identificador do mapa. Lembra que o div do mapa tomará como id «map» + o valor que lle asignes a id_carte_gis.

Se utilizamos a seguinte liña de código para chamar o modelo, necesitáremos definir as propiedades do div do xeito que se indica, para obter un mapa a pantalla completa.

 
[(#MODELE{carte_gis}{id_carte_gis='_sommaire'}{style='non'}{id_article}{id_rubrique}
{id_mot}{id_auteur}{recherche})]
 
#map_sommaire {
position:absolute;
bottom:0px;
top:0px;
left:0px;
right:0px;
}