How to add a tooltip to an svg graphic?

javascript svg d3.js tooltip

Can you use simply the SVG <title> element and the default browser rendering it conveys? (Note: this is not the same as the title attribute you can use on div/img/spans in html, it needs to be a child element named title)

rect {  width: 100%;  height: 100%;  fill: #69c;  stroke: #069;  stroke-width: 5px;  opacity: 0.5}

<p>Mouseover the rect to see the tooltip on supporting browsers.</p><svg xmlns="http://www.w3.org/2000/svg">  <rect>    <title>Hello, World!</title>  </rect></svg>

Expand snippet