Images cliquables

L'élément imagemap est utilisé pour définir les images cliquables dans les rubriques DITA.

Les images cliquables, également appelées graphiques hotspot et hypergraphiques segmentés, peuvent être définies dans le contenu DITA en utilisant l'élément imagemap et ses éléments enfants. Un élément imagemap s'applique à un élément image. Bien sûr, pour une sortie papier, lorsqu'une rubrique contenant des images cliquables est imprimée, la fonction de lien est perdue mais les images statiques apparaissent. Vous pouvez utiliser un traitement conditionnel afin que les images de l'image cliquable apparaissent seulement pour des formats en ligne.

L'élément imagemap est basé sur le modèle de l'élément map de la version HTML 4.1 ; il utilise cependant des éléments là où le format HTML utilise des attributs.

Tableau 1. Comparaison des noms des éléments d'image cliquable sous HTML et DITA
Balisage DITA Balisage HTML
élément imagemap élément map
élément image (dans imagemap) élément img (en dehors de map)
élément area élément area
élément shape attribut shape de l'élément area
élément coords attribut coords de l'élément area
attribut href de l'élément xref attribut href de l'élément area
contenu du texte de l'élément xref attribut alt de l'élément area

L'élément imagemap possède deux éléments enfants : un élément image et un élément area. L'élément image définit l'image sur laquelle seront superposées les zones cliquables. L'élément area contient les éléments shape, coords et xref qui spécifient les coordonnées de la zone et les liens cibles.

Un exemple de code DITA pour placer une image cliquable dans une rubrique serait :
<imagemap>
  <image href="../images/ej25.png" />
  <area>
    <shape>rect</shape>
    <coords>0,10,60,75</coords>
    <xref href="c_intercooler.dita">Echangeur thermique intermédiaire</xref>
  </area>
  <area>
    <shape>circle</shape>
    <coords>30,120,30</coords>
    <xref href="c_expansion.dita">Vase d'expansion</xref>
  </area>
</imagemap>
Remarque : Si votre outil de rédaction DITA ne prend pas correctement en charge la création d'images cliquables, vous pouvez utiliser un outil de rédaction Web pour définir l'image dans une page HTML, changez les attributs HTML en éléments DITA puis copiez ce code modifié dans votre rubrique DITA.

Les images cliquables ne sont pas autorisées au sein d'une structure figure (fig).