如何在Dagre布局中添加节点

Question

我试图通过cityscape.js将节点添加到dagre图中。问题是没有绘制节点。这是我目前拥有的代码：

cy.add({
      group: "nodes",
      data: { id:"n0",name:"n0",weight: 75 },
  });
  $.ajax(url).done(function(jsonTree){
      var newNodes=[];
      for(var i=1;i<6;i++){
        //var child = jsonTree.result[i];
        newNodes.push(
          { group: "nodes", data: { id: "n"+i, name:"n"+i}},
          { group: "edges", data: { id: "e"+i, source: "n0", target: "n"+i } }
        );

      }
      cy.add(newNodes);

有什么想法吗？我使用了loaded函数来重新加载图形，但是它不起作用。我不知道是否需要使用特定的函数来重新加载图形。

提前谢谢你。

Answer 1

您需要为新节点添加位置。来自cytoscape.js文档：

需要注意的是，在调用cy.add()时，必须定义新添加的节点的位置。在没有有效位置的情况下，不能将节点放置在图中，否则将无法显示它们。

对于for循环，您可能需要这样的内容：

  var newNodes=[];
  for(var i=1;i<6;i++){
     newNodes.push(
          { group: "nodes", 
              data: { 
                id: "n"+i, 
                name:"n"+i
              },
           //this is the bit you missed: position
              position: {
               x:25*i,
               y:20*i
              }
           },
          { group: "edges", 
           data: { 
             id: "e"+i, 
             source: "testnode", 
             target: "n"+i 
           } 
          }
        );
      }
  cy.add(newNodes);

下面是一个JSBin，它显示一个动态添加新节点的图