Extension:ImageMap/fr

L'extension ImageMap permet de cliquer sur image maps. Une image interactive est une liste de coordonnées dans une image spécifique, qui relie des zones de l'image à plusieurs destinations (contrairement à un lien d'image normal, dans lequel la totalité de la zone 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. So for example, the vertices of the polygon surrounding "Jude" (second to the far right in the image) has horizontal-coordinates (measured in pixels from the left) ranging between  –   and vertical-coordinates (measured in pixels from the top) ranging between   – , which are far outside of the range of the displayed 500 × 250 thumbnail but within range of the 9,600 × 4,800 original image. 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 dessus. Pour en savoir plus sur l'image, cliquez sur l'icône double rectangle



Description de la syntaxe
The contents of an tag consists of blank lines, comments (starting with #) and logical lines.

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.

If the first line specifies a " " or " " image, then the first line's caption and any alt parameter are treated as the image's caption and alt text in the usual way; otherwise, the first line's alt parameter (or, if absent, any caption) specifies the image's alt text.

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 le premier jeton de la ligne.

Une coordonnée se compose de deux jetons. Le premier jeton est la position horizontale (X) et le second est la position verticale (Y). Toutes les coordonnées sont en fonction de l'image pleine taille, pas de l'image visible. Les jetons X et Y doivent être spécifiés comme étant la distance du bord gauche (nombre de pixels horizontaux) et la distance du haut (nombre de pixels verticaux) de l'image pleine grandeur.


 * 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 " " ou " ", 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, 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 le caractere pipe "|" 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 après le pipe 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. If it is not present, you could get a page with only XML errors (tip: use the back-button in the browser, because you can still edit the page).
 * 3) Sur OVH hébergement mutualisé   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
If you want this extension (as with most tag extensions) to parse template parameters, magic words, or parser functions, you will need to use  syntax, such as w:Template:Click did. 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 pour contrôler la taille de l’image:

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

Where  is the input parameter “1” and a default image size of 640px.

Note: the input parameter requires a text string ending with “px” to function properly.

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
 * Add  after the image name (change the default image size to match the currently existing size).
 *  Note: By changing the default size (640px in this example) to the current image size, none of the existing template calls will have to be modified and will display correctly. Existing template calls can still be modified later by using the input parameter. 


 * Remplace the final par   (les accolades terminales).



Voir aussi

 * Instructions
 * A simple guide on how to use the Image Map editor with the ImageMap extension can be found at ImageMapEdit Howto on 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
 * Wikimedia Commons a également une page de ressources sur les cartes d’images: w:Catégorie:Cartes images Wikipédia


 * 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