2015-01-16 69 views
1

我正在使用VIS來構建圖形,但是存在問題。如果我創建簡單的層次圖:有3個頂點和3個邊,一個邊不可見(它隱藏在其他兩個頂點後面)。 使用與對角線平滑曲線交叉類型是解決方案的一部分 - 圖看起來不錯,但移動頂點後。頁面加載後直接看不到邊緣。可以修復它嗎?Vis,在啓動時看不到邊緣

繼承人我的代碼:

<!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> 

它使用分層視圖對我來說是很重要的。

回答

1

我認爲JavaScript中的HTML樣式註釋會阻止瀏覽器理解您的代碼。只需刪除評論並刷新瀏覽器即可。像這樣:

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