Add hyperlink to d3.js table rows and cells

Question

How can I add hyperlinks to d3-generated table rows and/or cells?

If I were following the same convention as adding hyperlinks to rects, lines, and other objects, after importing the xlink namespace, you append an a tag and set the hyperlink attribute, and then append your desired object, like so:

chartBody.selectAll("node")
    .data(dataset)
    .enter()
    .append("a")
    .attr("xlink:href", "http://stackoverflow.com")
    .append("line")
    ...

But when you change the character in the story from a rect or line to a table row or cell, it doesn't work...

tablebody.selectAll("row")
    .data(parsedtext)
    .enter().append("a")
    .attr("xlink:href", "http://stackoverflow.com")
    .append("tr")
    ...

Answer 1

Ah, ok then I think what you'll need to use is selection.html, as in:

var data = ['http://stackoverflow.com', 'http://d3js.org/']

var para = d3.select("body").append("p");

para.selectAll("p")
        .data(data)
        .enter()
        .append("p")
        .html(function(d,i){ return "<a href=\"" + d + "\">" + "site_" + i + "</a>"; });

I think you've probably got it covered from here but here's the link to the selection.html api doc. Basically this allows you to append (in this case) some innerHTML property. Given what I think you're doing it might be worth reading the Subselections section on that page.