手动将节点添加到JavaScript InfoVis Toolkit Force Directed Graph

Manually Add Nodes to JavaScript InfoVis Toolkit Force Directed Graph

本文关键字:Toolkit InfoVis Force Directed Graph JavaScript 节点 添加      更新时间:2023-09-26

我正在尝试使用JavaScript InfoVis Toolkit:JS InfoVis ToolKit来创建力定向图。我们真的不想使用 JSON 将数据"馈送"到图形中——相反,我们宁愿手动添加节点。

我已经将以下代码放在一起 - 但是当我尝试绘制图形时,在jit的第7118行找不到我的根节点.js(var root = aGraph.getNode(id);)。我省略了我的原力导向选项的细节 - 但这些应该不会影响结果。

        fd = new $jit.ForceDirected({...}) 
        //Create main node
        var rootNode = { id: "root", name: "Actors", data: { "$color": "#557EAA"} }
        fd.root = rootNode;
        fd.graph.addNode(rootNode);
        $.each(array, function (index, art) {
            var pubId = art.pubMedId.toString();
            var labelText = "Article " + pubId;
            var node = { id: pubId.toString(), name: labelText, data: { "$color": "#557EAA"} }
            //Create Nodes -- connect them to main node for now
            fd.graph.addNode(node);
            fd.graph.addAdjacence(rootNode, node, {});
            text = text + art.pubMedId + ',';
        });
        //Display graph
        fd.plot();

有人有这样做的经验吗?寻求指导。我已经在FireBug中进行了调试,并且所有内容似乎都正确加载到图形中(即 - 所有节点都存在)。我不知所措。

而不是fd.root = rootNode;,你想使用fd.root = rootNode.id;。我也对此感到惊讶。

此外,你可能希望在添加根节点之前初始化 Graph:

fd.graph = new $jit.Graph(fd.graphOptions, fd.config.Node, fd.config.Edge, fd.config.Label);

注意:已使用 2.0.1 版测试。