D3.js - 可折叠力布局 - 标记节点和链接

Question

我一直在使用d3.js - 可折叠力布局：http://bl.ocks.org/mbostock/1093130并认为我可以将其用作导航更复杂HTML页面的基础。

Here is a what i have at the moment

点击时节点是否有可能被勾勒出来？ （最理想情况下也是来自父节点的链接）。

d3.json("graph.json", function(error, json) {
  root = json;
  update();
});

//new code
var collapseMe = flatten(root);
for(var j = 0; j< collapseMe.length; j++){click(collapseMe[j])};

我的意图如下图所示：

ps：我已经创建了另一个关于在这里扩展节点的线程：d3.js - Collapsible Force Layout only partially collapsed所以它应该扩展，概括并同时链接到iframe。

希望它不会太复杂。

我将不胜感激。

致以最诚挚的问候，

更新于2016年1月14日：

感谢对原始问题的评论，我能够创建一个点击事件，在选中时标记节点及其链接 - see here。但是，当展开节点时，将标记通向该节点的所有链接。是否有可能只标记通向父母的链接？我的目的是只显示一个通向父节点的“路径”。

我相信答案在于这段代码函数neighbor（）和函数click（d）：

function neighboring(a, b) {
  return a.index == b.index || linkedByIndex[a.index + "," + b.index];
}

function click(d) {
  if (d3.event.defaultPrevented) return; // ignore drag
  if (d.children) {
    d._children = d.children;
    d.children = null;
  } else {
    d.children = d._children;
    d._children = null;
  }
  update();

  d3.selectAll(".link").transition().duration(500)
  .style("stroke-width", function(o) {
    return o.source === d || o.target === d ? 3 : 1;
  }).style("stroke", function(o) {
    return o.source === d || o.target === d ? "red" : "grey";
  });

  d3.selectAll(".node").transition().duration(500)
    .style("stroke-width", function(o) {
       return neighboring(d, o) ? 1 : 0;
    }).style("stroke", function(o) {
       return neighboring(d, o) ? "red" : "white";
    });
}