d3嵌套两个网络csv文件(节点和边缘)

时间:2014-05-07 16:32:45

标签: javascript csv d3.js nested graph-visualization

我正在尝试做的是d3.nest()将一个csv改为另一个。

节点列表如下所示:

id,movie,year,genre
85442,Hamlet,1907,Drama
57421,Don Quijote,1908,Drama
13146,Amleto [I],1908,Drama
85443,Hamlet,1908,Drama
160468,Othello,1909,Drama
160468,Othello,1909,Romance

边缘或链接看起来像这样:

sourceid,targetid
234,99455
234,125817
234,201681
476,72885
476,188536
476,246634
1028,14948
1028,60050

所以我想通过给定的ID将边缘嵌套到节点列表中。

我正在做一些看起来像这样的unclever嵌套:

    d3.csv("edges.csv", function(edges){
    d3.csv("nodes.csv", function(nodes){

        var nested_data = d3.nest()
            .key(function(d) { return d.sourceid; })
            .key(function(d) { return d.id; })
            .entries(edges)
            .entries(nodes);     
        console.debug(nested_data);
    });
    });

我搜索了帮助,发现了这个:D3 change elements based on two different datasets?

但是我无法理解它。这真的很难吗?或者可能有另一种方法吗?我发现了这个可视化(http://mbostock.github.io/d3/talk/20111116/airports.html),它还处理了两个csv文件和网络结构,而没有使用nest()。

谢谢,

1 个答案:

答案 0 :(得分:0)

因为很多人都在考虑这个问题,所以我想到了如何解决这个问题的简短跟进,现在我的理解。

拉斯已经给出了正确的提示。所以这里只是一个编码版本。

d3.csv("edges.csv", function(edges){
d3.csv("nodes.csv", function(nodes){

  var newlist = [];

  var i = edges.length;

  while(i--){

    var edge = edges[i];

      newlist.push(

          nodes[edge.sourceid].x),
          nodes[edge.targetid].y)

      );
  }

  var nested_data = d3.nest()
      .key(function(d) { return ... })
      .entries(newlist);  

  });
});

它完全不符合这个问题,因为它假设节点列表是由id排序的。上面的两个列表可以用http://underscorejs.org/#find

之类的东西进行迭代

希望这有帮助。