Extension:ImageMap/fr

L'extension ImageMap permet d'utiliser les cartographies d'images. Une cartographie d'image est une liste de coordonnées sur une image donnée, qui lie des zones de l'image à différentes destinations (contrairement au lien classique d'image où la totalité de l'image est liée à une seule destination). Par exemple, sur une carte du monde, chaque pays peut être relié par un hyperlien à d'autres informations sur ce pays. L'objectif d'une image interactive est de fournir un moyen facile de lier différentes parties d'une image sans diviser l'image en fichiers image séparés.

Exemples


Exemple simple sans légende
L'exemple ci-dessus renvoie toujours à la Main Page, peu importe où vous cliquez dessus. Pour en savoir plus sur l'image, cliquez sur l'icône bleue "i". Une autre façon de créer une telle image liée, sans utiliser cette extension, serait avec



Exemple complexe avec légende
Cet exemple affiche une vignette de 500 pixels de large sur une hauteur de 250 pixels; l' a une largeur de 9600 pixels et une hauteur de 4800 pixels. Les coordonnées de chaque vertex sont données en pixels et représentent un point de l'image originale. Donc par exemple les sommets du polygone qui entourent Jude (le second à partir de l'extrême droite de l'image) a des coordonnées horizontales (mesurées en pixels à partir de la gauche) dans l'intervalle  –   et des coordonnées verticales (mesurées aussi en pixels mais à partir du haut de l'image) dans l'intervalle   – , qui se situent loin au-delà de l'intervalle 500 × 250 représenté par la vignette, mais dans l'intervalle 9600 × 4800 de l'image originale. Notez qu'un vertex du polygone qui entoure Simon (à l'extrême droite de l'image), le vertex de coordonnées , s'étend au dela des limites de l'image originale de taille 9600 × 4800 pixels.

L'exemple ci-dessus renvoie à de nombreuses pages différentes, selon l'endroit où vous cliquez. Pour en savoir plus sur l'image, cliquez sur l'icône double rectangle



Description de la syntaxe
Le contenu d'une balise est formé de lignes vides, de commentaires (commençant par '#') et de lignes logiques.

La première ligne logique spécifie l'image à afficher. Utiliser le même format que pour les liens ordinaires vers les images MediaWiki (voir l'aide sur les images), mais en excluant les balises englobantes  et.

Si la première ligne indique une image   ou  , alors la légende de la première ligne et tout paramètre alt sont traités comme étant la légende de l'image et le texte du alt de manière usuelle; sinon, le paramère alt de la première ligne (ou s'il est absent, tout commentaire) spécifie le texte alt de l'image.

Dans aucun des cas, l'image elle-même n'a de texte de titre (souvent utilisé pour les info-bulles) ; tout texte de titre est tiré des régions décrites dans les lignes suivantes.

D'autres lignes sont divisées en jetons, séparés par des espaces. La fonction de chaque ligne est déterminée par la première marque de la ligne.

Une coordonnée se compose de deux marques. La première marque est la position horizontale (X) et la seconde est la position verticale (Y). Toutes les coordonnées sont exprimées en fonction de l'image en pleine taille, et non pas de l'image visible. Les marques X et Y doivent être spécifiées comme étant la distance du bord gauche (nombre de pixels horizontaux) et la distance du haut (nombre de pixels verticaux) de l'image en pleine taille.


 * desc
 * Spécifie l'emplacement d'une icône i bleue Desc-i.svg, qui renvoie à la description de l'image. Valeurs possibles :,   (par défaut),  ,  ,  . Ce paramètre est ignoré pour les images " " et " ", qui utilisent plutôt l'icône double rectangle habituelle Magnify-clip.png.


 * poly
 * Un polygone. Les coordonnées des sommets sont indiquées, suivies d'un lien entre crochets.


 * rect
 * Un rectangle. Les paramètres sont les coordonnées des coins supérieur gauche et inférieur droit, suivis d'un titre à lier entre crochets.
 * Exemple


 * circle
 * Un cercle. Les deux premiers paramètres sont les coordonnées du centre, et le troisième est le rayon. Les coordonnées sont suivies d'un lien entre crochets.


 * default
 * Cela donne le lien par défaut, où aucune autre région n'est spécifiée.

Toutes les coordonnées sont spécifiées par rapport à l'image source. L'image peut être mise à l'échelle à l'aide de la syntaxe des vignettes, auquel cas les coordonnées de l'image seront mises à l'échelle automatiquement.

Tous les liens sont donnés soit sous la forme titre_de_page ou description. Dans ce dernier cas, la partie après la barre verticale '|' devient l'attribut de titre du lien - dans la plupart des navigateurs, il apparaîtra sous forme d'info-bulle lorsque l'utilisateur le survolera ; la partie qui suit le '|' devient également le texte alternatif du lien. Si aucune description de lien explicite n'est donnée, le titre de la page est utilisé.

Les zones qui se chevauchent donnent la priorité au premier lien répertorié.

Installation
Assurez-vous que les téléchargements et ImageMagick sont installés :


 * Dépannage
 * 1) Vérifiez si votre DOM php est activé. Vous devrez peut-être l’installer si ce n’est pas le cas.
 * 2) Vérifier que  est installée, car elle utilise /usr/bin/convert pour le redimensionnement. S'il est absent, il es possible d'avoir une page avec seulement les erreurs XML (conseil : utiliser le bouton Arrière du navigateur, car vous pouvez encore modifier la page).
 * 3) Sur l'hébergement mutualisé OVH   devrait être comme ː

Composer
Vous pouvez aussi installer cette extension en utilisant le support intégré.

composer require mediawiki/image-map @dev



Utiliser des modèles, des mots magiques ou des fonctions d'analyse
Si vous souhaitez que cette extension (as with most tag extensions) analyse les paramètres du modèle, les mots magiques, ou les fonctions de l'analyseur, vous devrez utiliser la syntaxe, comme le faisait w:Template:Click. Dans ce cas, la barre verticale  doit être remplacée par un modèle , où le texte source du modèle est   (sauf quand ils apparaissent dans les liens ou les paramètres).


 * Exemple - formulaire standard :


 * Exemple - avec la variable :


 * Exemple – Modification pour accepter un paramètre d’entrée contrôlant la taille de l’image :

Ces modifications permettent d’ajuster la taille du modèle sur la page (cible) modifiée et d’éliminer la nécessité de créer des modèles en double adaptés aux différentes tailles d’images.

Où  est le paramètre d'entrée « 1 » et la taille par défaut de la page est de 640 pixels.

Note: le paramètre d'entrée nécessite que la chaîne de caractères se termine par px pour fonctionner correctement.

Par exemple, l'appel d'un modèle  affichera le modèle sur 400 pixels.

Pour convertir les cartes d’images standard (existantes) dans ce format facultatif :
 * Remplace the initial par
 * Ajouter  après le nom de l'image (modifier la taille par défaut de l'image pour qu'elle corresponde à celle du fichier actuel existant).
 * Note : en remplaçant la taille par défaut (640 pixels dans cet exemple) par la taille actuelle de l'image, aucun des appels existants au modèle n'a besoin d'être modifié et affichera correctement. Les appels existants, faits aux modèles, peuvent encore être modifiés ultérieurement en utilisant le paramètre d'entrée.


 * Remplacer the final par   (les accolades terminales).



Voir aussi

 * Instructions
 * Guide simple sur la manière d'utiliser l'éditeur Image Map avec l'extension ImageMap disponible à ImageMapEdit comment faire ? sur Meta-Wiki.
 * Le guide détaillé de l'utilisation de l'éditeur de cartographie d'image maschek est disponible sur ce site.
 * Wikimedia Commons a également une page de ressources sur les cartes d’images : Commons:Image map resources
 * Exemples existants de cartes d’images : w:Catégorie:Cartes images Wikipedia


 * Outils Wiki
 * meta:User:Dapete/ImageMapEdit - Script ImageMapEdit, un outil graphique pour déterminer les coordonnées qui peuvent être installées sur n’importe quel wiki.


 * Outils en ligne
 * http://www.maschek.hu/imagemap/imgmap Éditeur de carte d’images en ligne, prend en charge toutes les formes, Extension:ImageMap compatible.
 * http://www.image-maps.com/index.php? Mappage d’images en ligne de base.
 * http://summerstyle.github.io/summer/ - Mappage d’images en ligne interactif open-source


 * Fonctionnalités similaires
 * - travailler avec des diagrammes et des dessins