d3.js - 在 D3 中单击后如何防止鼠标移出？

Question

我正致力于在 D3 中开发一个力导向图。现在，当我将鼠标悬停在节点上时，它会将连接链接的不透明度从 0 更改为 1，然后当我将鼠标移出时，它会将不透明度返回到 0。

这很好用，但我遇到的问题是即使在 mouseout 事件发生后，单击节点也会将链接的不透明度保持在 1。然后我希望能够单击其他节点以使其链接的不透明度也为 1。然后还可以点击一些之前点击过的节点，可以将其关联链接的不透明度恢复为0。

简而言之，我希望能够切换节点关联链接的不透明度，而不会受到 mouseout 事件的影响。下面是我当前代码的示例。我在想我可能必须设置一个新的 ID 才能在我单击节点时打开和关闭？

var nodeClick = function(d) {
    svg.selectAll(".link")
    .filter(function(p) { 
          return _(d.facets).contains(p.target.name)
    })
    .transition()
    .style('stroke-opacity', 0.9);
};

var overText1 = function(d) {
    svg.selectAll(".link")
    .filter(function(p) { 
          return _(d.facets).contains(p.target.name)
    })
    .transition()
    .style('stroke-opacity', 0.9);
};

var overText0 = function(d) {
        svg.selectAll(".link")
        .transition()
        .duration(500)
        .style('stroke-opacity', 0);
    };

var node = svg.selectAll(".node")
    .data(graph.nodes)
    .enter().append("circle")
    .attr("class", function (d) {
        return d.group === 1 ? "nodeBig" : "node";
    })
    .attr("r", function(d) {return d.radius })
    .style("fill", function (d) {
        return color(d.group);
    })
    .on("mouseover", overText1)
    .on('click', nodeClick)
    .on('mouseout', overText0)
    .call(force.drag);

Answer 1

实际上我终于自己弄明白了。我创建了一个接受“真”或“假”的锁定字段。然后我在 mouseoff 函数中放置了一个 if 语句，该函数仅在其锁定字段中没有“true”的元素上启用 mouseoff 功能。