我如何给某些边缘一个类?

时间:2014-12-19 12:37:43

标签: javascript css d3.js

我有一个强制导向图,我可以在其中显示和隐藏节点。我希望根据是否显示或隐藏边缘源和目标来为边缘执行此操作。

这里我选择边缘,遍历所有选定的节点以查看它们中的任何一个是否与边缘源匹配,如果它们相同,再次循环它们以查看它们是否也与边缘的目标匹配然后我想要将edge类设置为“visible”如果它不显示source和target,则将class设置为“hidden”。

  var selectedNodes = d3.selectAll(".selectedNode"); 
  var linksVisible = d3.selectAll(".link.visible"); 

  var countOfVisibleLinks = [];
  linksVisible.each(function(o)
  {
      selectedNodes.each(function(i)
      {
          if(o.source.index === i.index)
          {
              //clog("yes1");
              selectedNodes.each(function(j)
              {
                  if(o.target.index === j.index)
                  { 
                      countOfVisibleLinks++;
                      //visibleLinks.push(o);

                      var myLink = d3.selectAll(".link.visible")
                                     .classed("hidden", function(d) { 
                                                           return d === o ? false : true;
                                                        });
                      //.filter(function(d) { return d === o; })
                      //.attr('class', 'hidden');

                   }
               })
          } 
      })
  });

'countOfVisibleLinks'可以正确计算可见边缘,但是之后的函数不会将所选择的设置为“可见”而未选择的设置为“隐藏”

有什么想法吗?

1 个答案:

答案 0 :(得分:1)

我尝试像

这样的东西
d3.selectAll(".link").attr("class", function(d) {
    var c = "link";
    if (d.source.visible && d.target.visible) { // or however you check the nodes?
        c += " visible";
    } else {
        c += " hidden";
    }
    return c;
});

对于您的方案,您可以使用if (selectedNodes.indexOf(d.source)...