Quelques éléments de HTML | Les info-bulles | Les liens
Le HTML (HyperText Markup Language) est le langage de base des pages internet/intranet. Il s'agit d'un langage de mise en forme, qui complète le texte vu à l'écran et permet de l'affubler de différents effets : gras, italique, mais aussi liens, insertion d'images, mise en forme de tableaux, ... Le langage HTML est composé de balises (tag en anglais) qui encadrent le texte à mettre en forme. Ainsi, le texte
BONJOUR est affiché BONJOUR
mais le texte
<B>BONJOUR</B> est affiché BONJOUR
Les éléments non affichés <B> et </B> sont des balises. La première annonce le début du texte mis en gras, la seconde marque la fin du texte mis en gras. Il en va de même pour de nombreuses balises, dont <A>, une des plus importantes : il s'agit de la balise qui gère les liens. Pour qu'un élément quelconque d'une page pointe vers une autre page, on l'encadre ainsi : <A HREF = "nom et chemin de ma page">élément (texte, image)</A>. Dans le cas d'une image, c'est l'intégralité de l'image qui pointe vers une autre page ; on peut cliquer n'importe où sur l'image avec le même effet.
On peut définir des zones sensibles sur une image. Il s'agit ainsi, soit de ne permettre le lien qu'en cliquant à certains endroits (par exemple une image dans laquelle est incrusté le texte "ENTRER"), soit de lier différentes zones de l'image à différentes pages. La définition des zones sensibles se fait au moyen d'un mapping. Il s'agit du marquage des limites de chaques zones, sous forme d'un rectangle, d'un cercle, ou d'un polygone quelconque.
Pour des zones de forme complexe, comme des éléments d'une carte (des départements par exemple), l'écriture du mapping est fastidieuse, mais ne nécessite que de connaître les sommets du polygone. Or, c'est exactement ce qui compose un fond de carte SAS. La production d'un mapping en SAS s'avère donc largement faisable.
Dernière possibilité offerte par le HTML en matière de lien, la possibilité d'afficher un texte quand la souris survole une zone liée. Ce texte apparaît dans un petit rectangle, en surimpression : on l'appelle une info-bulle.
<A TITLE = "Haut de la page" HREF = "#up">Survolez ce lien</A> s'affiche ainsi :
| Haut de la page |
L'option HTML = de la procédure GMAP permet de compléter les balises <A> par la syntaxe contenue dans une certaine variable. La construction de cette variable est laissée à la discrétion de l'utilisateur. On peut ainsi, en une simple étape Data, construire une info-bulle par département (en complétant la balise <A> par une instruction TITLE). La réalisation du mapping est ensuite l'affaire de la procédure GMAP et de l'ODS HTML.
DATA carto.chirac ;
SET carto.chirac ;
infobulle = "TITLE = " !! QUOTE(TRIM(ndept)) ;
RUN ;
ODS HTML BODY = "..." GPATH = "..." (URL = "...")
;
PROC GMAP DATA = carto.chirac
MAP
= fonds.depf (RENAME = (dep = dept))
ALL
;
ID dept ;
CHORO pct_voix / DISCRETE HTML = infobulle COUTLINE
= ORANGE NAME = "bulles" ;
FORMAT pct_voix votes. ;
LABEL pct_voix = "Votes Chirac au 1er tour" ;
RUN ; QUIT ;
ODS HTML CLOSE ;
On n'a pas associé de liens à la carte (on verra plus loin qu'on peut tout à fait le faire en même temps), mais en survolant la carte avec la souris, le nom des départements d'affiche automatiquement. On pourrait, avec quelques manipulations supplémentaires, faire apparaître plus de texte dans l'info-bulle : statistiques, nom de la région, numéro de département, nombre de communes, superficie, score à l'élection précédente, au second tour, etc...
| Haut de la page |
La construction des liens relève du même principe. Elle nécessite la production (préalable ou suivant immédiatement) d'autres pages web, celles vers lesquelles on pointe. Ce mode de navigation, très visuel, est très agréable à utiliser pour un site internet ou un intranet comportant une dimension géographique. L'ODS permet en outre la production de nombreuses pages Web sans utilisation de macro-langage, d'une manière très simple...
ODS HTML BODY = "... detail/page1.htm" NEWFILE = PAGE STYLE
= BARRETTSBLUE ;
PROC SORT DATA = carto.elect2002 ;
BY ndept DESCENDING pct_voix nom ;
RUN ;
PROC PRINT DATA = carto.elect2002 LABEL ;
VAR pct_voix ;
ID nom ;
BY ndept ;
PAGEBY ndept ;
LABEL ndept = "Département"
pct_voix = "Pourcentage
des voix exprimées"
nom
= "Candidat"
;
RUN ;
ODS HTML CLOSE ;
On écrit ici, pour chaque département, les résultats dans une page HTML séparée. La première s'appellera page1.htm, la deuxième page2.htm, etc... L'ODS se charge lui-même de la numérotation. Reste la définition des liens pour la procédure GMAP. C'est, là encore, l'affaire d'une petite étape Data.
DATA carto.chirac ;
SET carto.chirac ;
lien = "HREF = 'detail/page" !! COMPRESS(_N_) !!
".htm'" ;
RUN ;
ODS HTML BODY = "..." GPATH = "..." (URL = "...")
;
PROC GMAP DATA = carto.chirac
MAP
= fonds.depf (RENAME = (dep = dept))
ALL
;
ID dept ;
CHORO pct_voix / DISCRETE HTML = lien COUTLINE = ORANGE
NAME = "bulles" ;
FORMAT pct_voix votes. ;
LABEL pct_voix = "Votes Chirac au 1er tour" ;
RUN ; QUIT ;
ODS HTML CLOSE ;
L'ajout d'info-bulles en sus des liens ne s'avère pas plus complexe. La seule modification consiste à construire une dernière variable, concaténation des variables LIEN et INFOBULLE déjà vues.
DATA carto.chirac ;
SET carto.chirac ;
liencomplet = lien !! " " !! infobulle ;
RUN ;
ODS HTML BODY = "..." GPATH = "..." (URL = "...")
;
PROC GMAP DATA = carto.chirac
MAP
= fonds.depf (RENAME = (dep = dept))
ALL
;
ID dept ;
CHORO pct_voix / DISCRETE HTML = liencomplet COUTLINE
= ORANGE NAME = "bulles" ;
FORMAT pct_voix votes. ;
LABEL pct_voix = "Votes Chirac au 1er tour" ;
RUN ; QUIT ;
ODS HTML CLOSE ;
| Haut de la page |