javascript - d3 链接未正确隐藏

标签 javascript d3.js force-layout graph-visualization

我有一个 d3 力图,它具有能够隐藏/取消隐藏节点的功能。当用户选择(通过双击一个节点)并选择 hide 时,该节点及其相邻链接将消失。我的节点消失了,但出于某种原因,链接并没有随之消失。

以下是与此功能相关的代码片段:

// Node behavior for checking if the node is hidden.
node.style("visibility", function(d) {
    if (d.data['visible'] === false){
        console.log(d.data['id'] + " is hidden.")
        return "hidden";
    }
    else {
        return "visible";
    }
});

// Link color and visibility based on JSON data.
link.style("stroke", function(d) { return d.data['color'] })
    .style("visibility", function(d) {
        if (d.data['visible'] === false) {
            return "hidden";
        }
        else {
            return "visible";
        }});

function hideNode() {
    // Checks if any nodes are selected.
    if (selectedNodes.length > 0) {

        // Iterates over all of the selected nodes.
        for (var i = 0; i < selectedNodes.length; i++) {

            // Sets the node visible attribute to false and removes the node from the selected array.
            selectedNodes[i].data['visible'] = false;
            selectedNodes[i].selected = false;

            // Iterates through each of the edges to check visibility.
            for (var j = 0; j < edges.length; j++) {
                if (selectedNodes[i].data.id === edges[j].data.source || selectedNodes[i].data.id === edges[j].data.target) {
                    edges[j].data['visible'] === false;
                }
            }
        }
    }
    else alert("No node(s) selected.");
    update();
}

function revealNode() {
//    nodes.forEach(function(d) {
//        d.removed === false;
//    });
    for (var i = 0; i < nodes.length; i++) {
        nodes[i].data['visible'] = true;
    }
    update();
}

unhide 有效,hidenodes 但对links 有效。

供引用,这里是我的图表以及基本代码 http://bl.ocks.org/joeycf/f021e60bb38846dcfaf2

不确定我做错了什么。

最佳答案

我认为问题在于您在这里使用 === 而不是 =:

edges[j].data['visible'] === false;

希望对您有所帮助。

关于javascript - d3 链接未正确隐藏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30510530/

相关文章:

php - 在 PHP 中为 Google Map 调用 JavaScript 函数

javascript - Discord.js Tenor API 错误 [显示来自嵌入的图像]

javascript - D3.js 中的 setTimeout

javascript - 如何在 d3 的力布局图中获得相同的节点位置

javascript - 使用 JQuery 确定表中是否包含具有特定内容的行

javascript - 在特定力布局 D3 中标记节点的问题

javascript - 在 d3 中显示仪表中的小数点

javascript - 为什么我的 D3 map 中的文本隐藏在状态后面?

javascript - 另一个D3向强制有向图添加文本