D3.js 强制有向图更改鼠标上方所有连接节点的颜色

我有一个具有不同节点的力定向图，当用户将鼠标移到该图上时，我想更改选定节点和所有连接（相邻）节点的颜色

我正在努力做到这一点

function onMouseover(d){
  node.style("fill", function(o){
    var color = isConnected(d, o) ? 'red' : 'blue';
    return color;
  })
  force.resume();
}

function isConnected(d, o){
  return o.index === d,index || 
         (d.children && d.children.indexOf(o.index) !== -1) ||
         (o.children && o.children.indexOf(d.index) !== -1) ||
         (o.parents && o.parents.indexOf(d.index) !== -1) ||
         (d.parents && d.parents.indexOf(o.index) !== -1);
}

---

任何人都可以在这里帮助我，或者给我指一些类似的d3图。

这里是一个基于Mike Bostock的演示，它改变了悬停节点及其直接连接节点的颜色：

var svg=d3.选择（“svg”），
宽度=+svg.attr（“宽度”），
高度=+svg.attr（“高度”）；
var color=d3.scaleOrdinal（d3.schemeCategory 20）；
var simulation=d3.forceSimulation（）
.force（“link”，d3.forceLink（）.id（函数（d）{return d.id；}））
.force（“电荷”，d3.forceManyBody（））
.力（“中心”，d3.力中心（宽度/2，高度/2））；
d3.json（“https://gist.githubusercontent.com/mbostock/4062045/raw/5916d145c8c048a6e3086915a6be464467391c62/miserables.json，函数（错误，图形）{
如果（错误）抛出错误；
var link=svg.append（“g”）
.attr（“类”、“链接”）
.selectAll（“行”）
.数据（图表.链接）
.enter（）.append（“行”）
.attr（“笔划宽度”，函数（d）{return Math.sqrt（d.value）；}）；
var node=svg.append（“g”）
.attr（“类”、“节点”）
.selectAll（“圆圈”）
.数据（图.节点）
.enter（）.append（“圆”）
.attr（“r”，5）
.attr（“fill”，函数（d）{返回颜色（d.group）；}）
.call（d3.drag（）
.on（“开始”，拖动开始）
.打开（“拖动”，拖动）
。在（“结束”，dragended））；
node.append（“标题”）
.text（函数（d）{返回d.id；}）；
node.on（“鼠标悬停”，函数（d）{
var connectedNodeIds=图形
.链接
.filter（x=>x.source.id==d.id | | x.target.id==d.id）
.map（x=>x.source.id==d.id？x.target.id:x.source.id）；
d3.选择（“节点”）
.selectAll（“圆圈”）
.attr（“填充”，功能（c）{
if（connectedNodeIds.indexOf（c.id）>-1 | | c.id==d.id）返回“红色”；
else返回颜色（c组）；
});
});
node.on（“mouseout”，函数（d）{
d3.选择（“节点”）
.selectAll（“圆圈”）
.attr（“fill”，函数（c）{返回颜色（c.group）；}）；
});
模拟
.nodes（图.nodes）
。在（勾选）上；
模拟力（“链接”）
.links（图形链接）；
函数勾选（）{
链接
.attr（“x1”，函数（d）{返回d.source.x；}）
.attr（“y1”，函数（d）{返回d.source.y；}）
.attr（“x2”，函数（d）{返回d.target.x；}）
.attr（“y2”，函数（d）{返回d.target.y；}）；
节点
.attr（“cx”，函数（d）{return d.x；}）
.attr（“cy”，函数（d）{返回d.y；}）；
}
});
函数dragstarted（d）{
如果（！d3.event.active）simulation.alphaTarget（0.3.restart（）；
d、 fx=d.x；
d、 fy=d.y；
}
函数（d）{
d、 fx=d3.event.x；
d、 fy=d3.event.y；
}
函数d（d）{
如果（！d3.event.active）simulation.alphaTarget（0）；
d、 fx=null；
d、 fy=null；
}

.links行{
行程：#999；
笔划不透明度：0.6；
}
.节点圆{
冲程：#fff；
笔划宽度：1.5px；
}