如何給一個節點Vis.js到

選項我使用vis.js並想呈現，看起來曲線像這樣的：http://visjs.org/examples/network/nodeStyles/circularImages.html 如何給一個節點Vis.js到

的問題是，我不知道該怎麼爲每個節點設置圖像。在文檔有人說：

當你給一個節點選項，你將覆蓋全球選項用於財產，也是該集團選擇該屬性如果節點是一組。如果您然後將該選項設置爲空，那麼將恢復爲默認值。

但是沒有說關於如何給選項到一個特定的節點。

這裏是我的代碼：

<html> 
<head> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.18.1/vis.min.js"></script> 
    <link href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.18.1/vis.min.css" rel="stylesheet" type="text/css" /> 

    <style type="text/css"> 
     #mynetwork { 
      width: 600px; 
      height: 400px; 
      border: 1px solid lightgray; 
     } 
    </style> 
</head> 
<body> 
<div id="mynetwork"></div> 

<script type="text/javascript"> 

    var dot = 'hello {Hey->"I am lost"; 2->3; 5->3;}'; 
    var parsed = vis.network.convertDot(dot); 

    var data = { 
     nodes: parsed.nodes, 
     edges: parsed.edges 
    } 

    var options = parsed.options; 


    options.nodes = { 
     // everything that is here will apply globaly 

    } 

    var container = document.getElementById('mynetwork'); 

    var network = new vis.Network(container, data, options); 
</script> 
</body> 
</html>

來源

2017-02-27 Ivan Prizov

好吧，沒關係......看來，我已經找到了答案。看起來好像使用Dot語言不允許用戶單獨定製節點。

這個答案讓我：How to set the image size in Vis.js network graph

這裏就是我有

<html> 
 
<head> 
 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.18.1/vis.min.js"></script> 
 
    <link href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.18.1/vis.min.css" rel="stylesheet" type="text/css" /> 
 

 
    <style type="text/css"> 
 
     #mynetwork { 
 
      width: 600px; 
 
      height: 400px; 
 
      border: 1px solid lightgray; 
 
     } 
 
    </style> 
 
</head> 
 
<body> 
 
<div id="mynetwork"></div> 
 

 
<script type="text/javascript"> 
 
var edges = []; 
 
var nodes = []; 
 

 
nodes.push({ 
 
    id: 7, 
 
    shape: 'image', 
 
    image: 'https://yt3.ggpht.com/-v0soe-ievYE/AAAAAAAAAAI/AAAAAAAAAAA/OixOH_h84Po/s900-c-k-no-mo-rj-c0xffffff/photo.jpg', 
 
    label: 'Google', 
 
    widthMin: 20, 
 
    widthMax: 20 
 
}); 
 

 
nodes.push({ 
 
    id: 1, 
 
    label: 'hello!' 
 
}); 
 

 
nodes.push({ 
 
    id: 2, 
 
    shape: 'image', 
 
    image: 'https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcSbvJNLcGgzruK47eQfHZrcotFzMF0yeK28jgFUJCXh-36zm3Nz', 
 
    label: 'Maps' 
 

 
}) 
 

 
edges.push({ 
 
    from: 2, 
 
    to: 7, 
 
    arrows: 'from' 
 
}) 
 

 
edges.push({ 
 
    from: 1, 
 
    to: 7, 
 
    length: 100 
 
}); 
 

 
var data = { 
 
    nodes: nodes, 
 
    edges: edges 
 
}; 
 

 
    var options = {}; 
 
    var container = document.getElementById('mynetwork'); 
 
    network = new vis.Network(container, data, options); 
 

 
</script> 
 
</body> 
 
</html>

來源

2017-02-28 07:09:08

如何給一個節點Vis.js到

回答

相關問題