3

如何将超链接添加到 d3 生成的表格行和/或单元格?

如果我遵循与向矩形、线条和其他对象添加超链接相同的约定,则在导入 xlink 命名空间后,您附加一个a标记并设置超链接属性,然后附加您想要的对象,如下所示:

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

但是,当您将故事中的角色从矩形或线更改为表格行或单元格时,它就不起作用了……

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

2 回答 2

3

啊,好的,那么我认为您需要使用的是selection.html,如:

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>"; });

我想你可能已经从这里得到了它,但这里是selection.html api doc的链接。基本上,这允许您附加(在这种情况下)一些 innerHTML 属性。鉴于我认为您正在做的事情,可能值得阅读该页面上的 Subselections 部分。

于 2013-09-22T02:01:01.423 回答
0

这是因为矩形和线条是 SVG 元素,而表格是 HTML 元素。(至少我在 SVG 中找不到任何对表格元素的引用。)

至于 HTML,没有row元素,也不是有效的 HTML 将表格行包含在锚标记中。

于 2013-09-22T00:17:51.193 回答