javascript - 在表 D3 中的导入数据中放置链接

Question

我正在通过 d3.js 将一些数据从 csv 导入到表中。我在此步骤中想要的是当用户单击其中一个单元格时放置指向其他页面的链接。

我有一个带有转换器 ID 列的表，如果用户单击转换器的 ID，他们将被重定向到其页面(已在 html 中创建)。

我看过一些 .attr 的示例，但我几周前才开始学习 d3.js，目前我还无法自己编写代码。

你能帮我吗？

$(document).ready(function()
{
    d3.text("data/table-assets.csv", function(data) 
    {
        var parsedCSV = d3.csv.parseRows(data);
        var container = d3.select(".table-striped")
            .append("tbody")
            .selectAll("tr")
            .data(parsedCSV).enter()
            .append("tr")

            .selectAll("td")
            .data(function(d) { return d; }).enter()
            .append("td")
            .text(function(d) { return d; }).style('background-color',function(d){
if(d>90){
return "#4CC417";
}
                else if(d<90 && d>80){
                return "#B2C248";
                }
                else if(d<80) {
                    return "#DC381F";
                }}).style('color', function(d){
                if(d>0){
                    return "white";
                }
                });
     });        
});

Answer 1

可以使用 .append('a').attr('href',function(d){return ...}) 创建的链接

稍微构造一下代码是一个很好的做法:

var tr = table.selectAll("tr").data(...)
var tr_new = tr.enter().append("tr")
tr_new...//set styles etc.
var td = tr_new.selectAll("td").data(...)
var td_new = td.enter().append("td")
td_new...//set styles, append contents etc.