<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
style="position:absolute;" width="271"
height="599" pointer-events="visible">
<a xlink:href="http://en.wikipedia.org/wiki/Northern_Ireland"
xlink:title="Northern Ireland">
<polygon id="area_ni" class="area" points="20,312 23,301 51,287 63,289 84,329 64,353 45,351 38,340 28,350 10,344 1,330 10,314">
<title>Northern Ireland</title>
<desc>Map of Northern Ireland</desc>
</polygon>
</a>
…
</svg>
<line x1="10" y1="20" x2="30" y2="40" stroke="green" stroke-width="2" />
<text x="10" y="20" fill="green" font-size="10">This is my text</text>
<rectangle x="10" y="20" width="10" heigth="20" style="stroke=green;stroke-width=2" fill="red" fill-opacity="0.5" />
<polygon fill="red" fill-opacity="0.5" style="stroke=green;stroke-width=2" points="10,10 20,20 30,10" />
<image x="0" y="100" href="mdn_logo_only_color.png" height="200" width="200" />
<style>
circle { fill: gold; stroke: maroon; stroke-width: 2px; }
.heavy { font: bold 30px sans-serif; }
</style>
<circle cx="5" cy="5" r="4" />
<text class="heavy" x="10" y="20">