如何在Vis.js中為節點提供選項

Question

我正在使用vis.js，並希望呈現一個像這樣的圖形： http : //visjs.org/examples/network/nodeStyles/circularImages.html

問題是我不知道如何為每個節點設置圖像。 在文檔中說：

給節點提供選項后，將覆蓋該屬性的全局選項，如果該節點在組中，則還將覆蓋該屬性的組選項。 然后，如果將該選項設置為null，它將恢復為默認值。

但是，關於如何給特定節點提供選擇權卻一言不發。

這是我的代碼：

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

Answer 1

好的，沒關系...似乎我已經找到了答案。 似乎使用Dot語言不允許用戶單獨自定義節點。

這個答案對我有幫助：如何在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 edges = []; var nodes = []; nodes.push({ id: 7, shape: 'image', image: 'https://yt3.ggpht.com/-v0soe-ievYE/AAAAAAAAAAI/AAAAAAAAAAA/OixOH_h84Po/s900-ck-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>

如何在Vis.js中為節點提供選項

問題描述

1 個解決方案

解決方案1
0 2017-02-28 07:09:08

如何在Vis.js中為節點提供選項

問題描述

1 個解決方案

解決方案1 0 2017-02-28 07:09:08

解決方案1
0 2017-02-28 07:09:08