我正在使用VIS来构建一个图,但是有一个问题。如果我创建一个简单的层次图:有3个顶点和3条边,其中一条边是不可见的(它隐藏在另外两个顶点后面)。
使用具有对角线交叉类型的平滑曲线是解决方案图的一部分-看起来不错,但在移动顶点之后。直接在页面加载后边缘不可见。能修好吗?
这是我的代码:

<!doctype html>
<html>
<head>
  <title>Network | Basic usage</title>
  <script type="text/javascript" src="vis.js"></script>
  <link rel="stylesheet" type="text/css" href="vis.css">
</head>
<body>
<div id="mynetwork"></div>

<script type="text/javascript">
  // create an array with nodes
  var nodes = [
    {id: 1, label: 'Node 1', level:0},
    {id: 2, label: 'Node 2', level:1},
    {id: 4, label: 'Node 4', level:2}
  ];

  // create an array with edges
  var edges = [
    {from: 1, to: 2},
    {from: 1, to: 4},
    {from: 2, to: 4}
  ];

  // create a network
  var container = document.getElementById('mynetwork');
  var data= {
    nodes: nodes,
    edges: edges,
  };
  var options = {
    width: '900px',
    height: '900px',
    edges:
    {
        style: 'arrow'
    },
    dragNetwork: true,
    navigation: true,
    keyboard: true,
    <!-- dragNodes: false, -->
    hierarchicalLayout: {enabled:true}
  };
  var network = new vis.Network(container, data, options);
  var type = "diagonalCross";
  network.setOptions({smoothCurves:{type:type}});
</script>
</body>
</html>

对我来说使用层次视图很重要。

最佳答案

我认为javascript中的HTML风格的注释阻止浏览器理解您的代码。只需删除评论并刷新浏览器。这样地:

var options = {
    width: '900px',
    height: '900px',
    edges: {
        style: 'arrow'
    },
    dragNetwork: true,
    navigation: true,
    keyboard: true,
    // <!-- dragNodes: false, -->
    hierarchicalLayout: {enabled:true}
  };

关于javascript - 可见,启动时不可见边缘,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/27990453/

10-12 12:51
查看更多