|Graphics and figures|
The imagemap element is used to define image maps (hotspot graphics) in DITA topics.
Image maps, also known as hotspot graphics and segmented hypergraphics, can be defined in DITA content using the imagemap element and its child elements. An imagemap element is applied to a standard image element. Obviously, when a topic which includes an image map is output to paper, the linking function will be lost; however, the static image will be rendered. You may want to use conditional processing so that image map graphics are only output to online delivery formats.
The DITA imagemap element is modelled on the HTML 4.1 map element, but uses elements where HTML uses attributes.
|DITA mark-up||HTML mark-up|
|imagemap element||map element|
|image element (inside imagemap)||img element (outside map)|
|area element||area element|
|shape element||shape attribute of area element|
|coords element||coords attribute of area element|
|href attribute of xref element||href attribute of area element|
|text content of xref element||alt attribute of area element|
The imagemap element has two child elements: an image element and an area element. The image element defines the image to which the clickable hotspot areas will be overlaid. The area element contains shape, coords, and xref elements which specify the hotspot co-ordinates and link targets.
<imagemap> <image href="../images/ej25.png" /> <area> <shape>rect</shape> <coords>0,10,60,75</coords> <xref href="c_intercooler.dita">Intercooler</xref> </area> <area> <shape>circle</shape> <coords>30,120,30</coords> <xref href="c_expansion.dita">Expansion tank</xref> </area> </imagemap>
Image maps are not permitted within a figure (fig) structure.