Dynamic link
HTML
<script src="http://d3js.org/d3.v3.min.js"></script>
CSS
svg a text{
text-decoration: underline;
}
JavaScript
var data = ['a', 'b', 'c'];
var svg = d3.select("body").append("svg")
.attr({
xmlns: "http://www.w3.org/2000/svg",
xlink: "http://www.w3.org/1999/xlink",
width: 100,
height: 300
})
.selectAll("a")
.data(data)
.enter().append("a")
.attr({"xlink:href": "#"})
.on("mouseover", function(d, i){
d3.select(this)
.wrap("<a xlink:href \"http://example.com/\"></a>")
.text("eeeeeeeeeeeeeeeeeee");
})
.append("text")
.attr({x: 10, y: function(d, i){ return i*15+15; }})
.text(function(d, i){ return d; });