Question

我试图在visjs上建立一个网络。但是每当我到达

else if (version.slice(-7).toUpperCase() == 'DEFAULT')

我收到错误消息，说明该ID已存在。正如您在代码中看到的，我将ID指定为等于for循环的迭代。问题从迭代/ ID 10开始。我在代码中设置了一个断点来检查节点和值，正如您在图像中看到的那样，节点对象实际上并不包含ID为10的节点。我可以＆似乎弄清楚这里的问题是什么。有人有什么建议吗？

Image of breakpoint

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Geoinfo SDE StateTree</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis.min.css" type="text/css" />

    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/4.4.0/papaparse.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis.min.js"></script>
<script type="text/javascript">
Papa.parse("WIL_sde_states_fejl.txt", {
  download: true,
  complete: function(results) {
    var tree = results.data;
    var nodes = new vis.DataSet();
    var edges = new vis.DataSet();
    var levels = [];
    var state, parent, version, lineage;
    for (i = 1; i < tree.length; i++) {
      id = String(i)
      state = tree[i][0];
      parent = tree[i][1];
      version = tree[i][2];
      lineage = tree[i][3];
      if (version.toUpperCase() === '') {
        if (state != parent) {
          nodes.add([{
            id: id,
            lid: lineage,
            label: state
          }]);
          edges.add([{
            from: id,
            to: parent
          }]);

        } else {
          nodes.add([{
            id: id,
            lid: lineage,
            label: state,
            color: '#0000FF'
          }]);
        }
      }else if (version.slice(-7).toUpperCase() == 'DEFAULT') {
        nodes.add([{
          id: id,
          lid: lineage,
          label: state
        }, {
          id: id, //state.concat('v')
          lid: lineage,
          label: version,
          color: '#ff0000'
        }]);
        edges.add([{
          from: id,
          to: parent
        }, {
          from: id,//state.concat('v'),
          to: state,
          arrows: {
            to: {
              enabled: true
            },
            from: {
              enabled: false
            }
          }
        }]);
      }else if (version.slice(0, 5).toUpperCase() == 'SYNC_') {
        nodes.add([{
          id: id,
          lid: lineage,
          label: state
        }, {
          id: id, //state.concat('v'),
          lid: lineage,
          label: version,
          color: '#ff6600'
        }]);
        edges.add([{
          from: state,
          to: parent
        }, {
          from: id,//state.concat('v'),
          to: state,
          arrows: {
            to: {
              enabled: true
            },
            from: {
              enabled: false
            }
          }
        }]);
      }else {
        nodes.add([{
          id: id,
          lid: lineage,
          label: state
        }, {
          id: id,//state.concat('v')
          lid: lineage,
          label: version,
          color: '#ffcc00'
        }]);
        edges.add([{
          from: id,
          to: parent
        }, {
          from: id, //state.concat('v'),
          to: state,
          arrows: {
            to: {
              enabled: true
            },
            from: {
              enabled: false
            }
          }
        }]);
      }
    }
    // create a network
    var container = document.getElementById('mynetwork');
    var data = {
      nodes: nodes,
      edges: edges
    };
    var options = {
      layout: {
        hierarchical: {
          enabled: true
        }
      },
      nodes: {
        shape: 'dot',
        size: 20,
        borderWidth: 0.5,
        color: {
          border: '000000',
          background: '#77d14a'
        },
        font: {
          background: '#FFFFFF'
        }
      },
      edges: {
        width: 0.5,
        color: '000000',
        arrows: 'from'
      },
      physics: {
        stabilization: false
      }
    };
    var network = new vis.Network(container, data, options);
  }
});
</script>


    <style>
    #mynetwork {
        width: 98%;
        height: 98%;
        border: 1px solid lightgray;
    }
    </style>


  </head>
  <body>


    <div id="mynetwork"></div>
  </body>
</html>

Answer 1

好的，我弄明白了这个问题。

nodes.add([{
    id: id,
    lid: lineage,
    label: state
}, {
    id: id, //state.concat('v')
    lid: lineage,
    label: version,
    color: '#ff0000'
}]);

这两个ID不能有相同的名称。

无法在visjs中创建节点，ID已存在

1 个答案: