15.2. Image Map

Sur le web on utilise fréquemment des images dites sensibles (ou cliquables) avec lesquelles il est possible d'obtenir différents effets lorsque certaines zones sont « sollicitées » par le curseur de la souris. L'utilisation la plus courante est, sans doute, un lien dynamique vers une autre page web lorsqu'on clique sur une de ces zones sensibles. Ce « filtre » permet de délimiter facilement la ou les zones sensibles souhaitées dans une image. Les logiciels de création de sites web ont cette fonction en standard. Avec ce « filtre » de GIMP vous avez la possibilité de faire la même chose.

15.2.1. Généralités

Avec ce greffon vous pouvez définir graphiquement et de façon conviviale, avec l'image visible, toutes les zones que vous voulez délimiter et de générer la partie correspondante des balises html qui doivent être incorporées dans le code html de votre page Web contenant une image cliquable. Vous pouvez également définir quelques actions associées à ces zones.

Il s'agit d'un outil complexe qui n'est pas décrit complètement ici (il ressemble beaucoup à des logiciels de construction de page Web qui offrent cette fonction). Nous allons cependant en décrire les manipulations les plus courantes. Vous trouverez, si vous le souhaitez, une approche beaucoup plus complète dans Grokking the GIMP en utilisant le lien [GROKKING02].

15.2.2. Activating the Filter

This filter is found in the main menu under FiltersWebImage Map….

Cette fenêtre est de dimensions réduite ; évidemment vous pouvez l'agrandir. Les principales zones à considérer sont :

  • tout à gauche et disposées verticalement : les icônes de pointage, d'appel des outils de formes à générer, celle d'édition des propriétés et celle d'effacement de la zone ; ces fonctions peuvent également être appelées avec le menu Zones,

  • à droite de celle-ci, la zone d'affichage de l'image à traiter et dans laquelle apparaîtront les zones à délimiter ; ce sera votre zone de travail,

  • à droite encore, un arrangement vertical d'icônes dont l'utilisation est évidente ; leur survol avec le pointeur de souris fait apparaître une bulle d'information,

  • enfin encore plus à droite une zone d'affichage, sous forme de liste, des propriétés des zones crées. Un clic sur l'un des articles de la liste permet de sélectionner la zone correspondante dans la zone de travail.

15.2.3. Options

Figure 17.407. Image Map filter options

Image Map filter options

Image map window


15.2.3.1. La barre de menus

The menu bar is similar to the main menu, only a few menus or menu entries are different:

Fichier
Save, Save As

Contrairement à d'autres filtres, ce greffon ne produit pas d'image mais un fichier texte. Pour enregistrer votre travail vous devez donc le faire dans un format texte.

[Astuce] Astuce

Avec AffichageSource vous pouvez voir ce que contient ce fichier texte.

Open, Open recent

Dans le greffon vous pouvez ouvrir le fichier texte sauvegardé. Les zones définies dans le fichier seront alors superposées à votre image ; si celle-ci n'est plus l'originale ou si elle n'est pas de la même taille, GIMP vous demandera si vous voulez adapter l'échelle.

Édition
Éditer les paramètres de la zone

Figure 17.408. Editing an image map area

Editing an image map area

Dans cette fenêtre de dialogue, vous pouvez modifier les paramètres d'une aire sélectionnée. Cette fenêtre apparaît aussi dès que vous cliquez après avoir tracé une zone.

Affichage

Ce menu vous offre quelques fonctions spéciales :

Area List

Vous permet de masquer les zones, ou de les rendre visibles.

Source…

Vous permet d'afficher les données que vous enregistrerez ou de lire celles que vous avez chargées.

Color, Gray

Ces fonctions vous permettent de définir le mode de l'image traitée par le filtre, en couleur ou en nuances de gris.

Mappings

Vous utiliserez probablement rarement ce menu, puisque vous accédez aux outils plus facilement en cliquant sur les icônes à gauche de l'espace de travail.

Flèche

La flèche est ici le symbole de l'outil de déplacement. quand elle est sélectionnée, vous pouvez sélectionner une zone et la déplacer.

Avec un polygone, vous pouvez aussi utiliser la flèche pour déplacer un des points rouges et déformer le polygone. Un clic droit sur un segment entre deux points rouges ouvre un menu contextuel vous offrant diverses possibilités : effacer un point, ajouter un nouveau point... Avec un clic droit sur un point rouge, vous pouvez le supprimer.

Rectangle, Circle, Polygon

Avec ces outils, vous pouvez créer une zone cliquable de la forme voulue. Cliquez sur l'image et faites glisser le pointeur jusqu'à ce que la zone ait la taille désirée, et cliquez encore une fois pour ouvrir l'Éditeur de zone.

Edit Map Info…

Figure 17.409. Editing the image map data

Editing the image map data

dans ce dialogue simple, vous pouvez entrer certains paramètres qui seront inscrits dans l'image de sortie; soit à titre de commentaire (Auteur, Description), soit comme valeurs d'attribut des balises HTML (Nom d'image, Titre, URL par défaut).

Outils

Dans le menu « Outils » vous pouvez créer des guides et des grilles :

Grid, Grid Settings…

Figure 17.410. Options Grille

Options Grille

Vous pouvez établir ou supprimer une grille et en régler les paramètres.

Use GIMP Guides…, Create Guides…

Ces options ne sont pas encore fonctionnelles.

Création de guides

Figure 17.411. Options Guides

Options Guides

Les options Guides


Au lieu de créer des formes géométriques pour sélectionner les régions actives, vous pouvez utiliser un tableau de rectangles, chacun représentant une région active, en cliquant sur « Créer des guides ». Dans le menu qui apparaît vous fixez la largeur et la hauteur des rectangles, l'espace entre eux, le nombre de lignes et de colonnes et le point de départ en haut à gauche du tableau. Toutes les mesures sont en pixels. Si vous n'êtes pas satisfait du résultat, vous pouvez ajuster chaque rectangle en déplaçant les carrés rouges comme d'habitude.

15.2.3.2. La barre d'outils

La plupart des entrées sont des raccourcis pour des fonctions déjà décrites, sauf :

Move Area to Front, Move Area to Bottom

Here you can move an area entry to the bottom or top of the area list.

15.2.3.3. L'espace de travail

Figure 17.412. L'espace de travail

L'espace de travail

In the main area of the image map window, on the left side, you will find your working area where you can draw all the shapes areas you want with the relevant tools.

À droite de celle-ci, l'aire d'affichage de l'image à traiter et dans laquelle apparaîtront les zones à délimiter ; ce sera votre espace de travail,

[Attention] Attention

Notez que les zones ne doivent pas se recouvrir.

15.2.3.4. L'espace de sélection

À droite encore, un arrangement vertical d'icônes dont l'utilisation est évidente ; leur survol avec le pointeur de souris fait apparaître une bulle d'information.

À côté de l'écran se trouve une liste verticale d'icônes : son utilisation est évidente mais une aide contextuelle vous donne quelques informations sur chaque fonction.

Lorsque vous sélectionnez une zone dans la liste, le contour correspondant est également sélectionné dans la zone de travail et vous pouvez alors le modifier.