14.2. Carte cliquable

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.

14.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].

14.2.2. Ouverture du filtre

Depuis une fenêtre d'image, on accède à ce filtre par FiltresWebCarte cliquable.

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.

14.2.3. Options

Figure 16.326. Options du filtre Carte cliquable

Options du filtre Carte cliquable

La fenêtre du filtre Carte cliquable


14.2.3.1. La barre de menus

La barre de menus ressemble à celle de la fenêtre d'image, à part quelques entrées différentes :

Fichier
Enregistrer, Enregistrer sous

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.

Ouvrir

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 16.327. Éditer les paramètres de la zone

Éditer les paramètres de la zone

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 :

Liste des zones

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.

Couleur; Gris

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

Cartographie

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; Cercle; Polygone

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.

Éditer l'information de carte

Figure 16.328. Éditer les paramètres de la carte

Éditer les paramètres de la carte

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 :

Grille; Paramètres de la grille

Figure 16.329. Options Grille

Options Grille

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

Utiliser les guides GIMP ; Créer des guides

Ces options ne sont pas encore fonctionnelles.

Création de guides

Figure 16.330. 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 n 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.

14.2.3.2. La barre d'outils

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

Déplacer vers l'avant; Déplacer vers l'arrière

Vous pouvez faire passer une zone en première position dans la liste et donc la rendre accessible à l'utilisateur.

14.2.3.3. L'espace de travail

Figure 16.331. L'espace de travail

L'espace de travail

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 Cartographie,

À 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.

14.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.

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.

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.