Spaces:
Sleeping
Sleeping
File size: 20,403 Bytes
0ee871b | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 | <html>
<head>
<meta charset="utf-8">
<script src="lib/bindings/utils.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/vis-network/9.1.2/dist/dist/vis-network.min.css" integrity="sha512-WgxfT5LWjfszlPHXRmBWHkV2eceiWTOBvrKCNbdgDYTHrT2AeLCGbF4sZlZw3UMN3WtL0tGUoIAKsu8mllg/XA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/vis-network/9.1.2/dist/vis-network.min.js" integrity="sha512-LnvoEWDFrqGHlHmDD2101OrLcbsfkrzoSpvtSQtxK3RMnRV0eOkhhBN2dXHKRrUU8p2DGRTk35n4O8nWSVe1mQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<center>
<h1></h1>
</center>
<!-- <link rel="stylesheet" href="../node_modules/vis/dist/vis.min.css" type="text/css" />
<script type="text/javascript" src="../node_modules/vis/dist/vis.js"> </script>-->
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6"
crossorigin="anonymous"
/>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf"
crossorigin="anonymous"
></script>
<center>
<h1></h1>
</center>
<style type="text/css">
#mynetwork {
width: 1500px;
height: 1000px;
background-color: #222222;
border: 1px solid lightgray;
position: relative;
float: left;
}
#config {
float: left;
width: 400px;
height: 600px;
}
</style>
</head>
<body>
<div class="card" style="width: 100%">
<div id="mynetwork" class="card-body"></div>
</div>
<div id="config"></div>
<script type="text/javascript">
// initialize global variables.
var edges;
var nodes;
var allNodes;
var allEdges;
var nodeColors;
var originalNodes;
var network;
var container;
var options, data;
var filter = {
item : '',
property : '',
value : []
};
// This method is responsible for drawing the graph, returns the drawn network
function drawGraph() {
var container = document.getElementById('mynetwork');
// parsing and collecting nodes and edges from the python
nodes = new vis.DataSet([{"font": {"color": "white"}, "group": 0, "id": "Harry", "label": "Harry", "shape": "dot", "size": 40}, {"font": {"color": "white"}, "group": 0, "id": "Petunia", "label": "Petunia", "shape": "dot", "size": 4}, {"font": {"color": "white"}, "group": 0, "id": "Dudley", "label": "Dudley", "shape": "dot", "size": 4}, {"font": {"color": "white"}, "group": 1, "id": "Snape", "label": "Snape", "shape": "dot", "size": 11}, {"font": {"color": "white"}, "group": 1, "id": "Hagrid", "label": "Hagrid", "shape": "dot", "size": 17}, {"font": {"color": "white"}, "group": 0, "id": "Hedwig", "label": "Hedwig", "shape": "dot", "size": 4}, {"font": {"color": "white"}, "group": 3, "id": "Voldemort", "label": "Voldemort", "shape": "dot", "size": 4}, {"font": {"color": "white"}, "group": 0, "id": "Vernon", "label": "Vernon", "shape": "dot", "size": 2}, {"font": {"color": "white"}, "group": 2, "id": "Ron", "label": "Ron", "shape": "dot", "size": 29}, {"font": {"color": "white"}, "group": 0, "id": "Dobby", "label": "Dobby", "shape": "dot", "size": 11}, {"font": {"color": "white"}, "group": 4, "id": "Dumbledore", "label": "Dumbledore", "shape": "dot", "size": 16}, {"font": {"color": "white"}, "group": 3, "id": "Hermione", "label": "Hermione", "shape": "dot", "size": 18}, {"font": {"color": "white"}, "group": 0, "id": "Fred", "label": "Fred", "shape": "dot", "size": 11}, {"font": {"color": "white"}, "group": 3, "id": "Malfoy", "label": "Malfoy", "shape": "dot", "size": 17}, {"font": {"color": "white"}, "group": 2, "id": "Scabbers", "label": "Scabbers", "shape": "dot", "size": 2}, {"font": {"color": "white"}, "group": 3, "id": "Ginny", "label": "Ginny", "shape": "dot", "size": 13}, {"font": {"color": "white"}, "group": 3, "id": "Percy", "label": "Percy", "shape": "dot", "size": 10}, {"font": {"color": "white"}, "group": 3, "id": "Charlie", "label": "Charlie", "shape": "dot", "size": 3}, {"font": {"color": "white"}, "group": 0, "id": "Molly", "label": "Molly", "shape": "dot", "size": 2}, {"font": {"color": "white"}, "group": 0, "id": "Arthur", "label": "Arthur", "shape": "dot", "size": 4}, {"font": {"color": "white"}, "group": 1, "id": "Seamus", "label": "Seamus", "shape": "dot", "size": 5}, {"font": {"color": "white"}, "group": 1, "id": "Neville", "label": "Neville", "shape": "dot", "size": 11}, {"font": {"color": "white"}, "group": 4, "id": "Colin", "label": "Colin", "shape": "dot", "size": 10}, {"font": {"color": "white"}, "group": 1, "id": "Dean", "label": "Dean", "shape": "dot", "size": 6}, {"font": {"color": "white"}, "group": 4, "id": "Fang", "label": "Fang", "shape": "dot", "size": 4}, {"font": {"color": "white"}, "group": 3, "id": "Peeves", "label": "Peeves", "shape": "dot", "size": 4}, {"font": {"color": "white"}, "group": 0, "id": "Bloody", "label": "Bloody", "shape": "dot", "size": 2}, {"font": {"color": "white"}, "group": 3, "id": "Myrtle", "label": "Myrtle", "shape": "dot", "size": 7}, {"font": {"color": "white"}, "group": 3, "id": "Bill", "label": "Bill", "shape": "dot", "size": 5}, {"font": {"color": "white"}, "group": 1, "id": "Justin", "label": "Justin", "shape": "dot", "size": 9}, {"font": {"color": "white"}, "group": 0, "id": "Angelina", "label": "Angelina", "shape": "dot", "size": 1}, {"font": {"color": "white"}, "group": 0, "id": "Oliver", "label": "Oliver", "shape": "dot", "size": 1}, {"font": {"color": "white"}, "group": 3, "id": "Goyle", "label": "Goyle", "shape": "dot", "size": 8}, {"font": {"color": "white"}, "group": 2, "id": "Hannah", "label": "Hannah", "shape": "dot", "size": 3}, {"font": {"color": "white"}, "group": 2, "id": "Ernie", "label": "Ernie", "shape": "dot", "size": 6}, {"font": {"color": "white"}, "group": 2, "id": "Fawkes", "label": "Fawkes", "shape": "dot", "size": 5}, {"font": {"color": "white"}, "group": 2, "id": "Crabbe", "label": "Crabbe", "shape": "dot", "size": 4}, {"font": {"color": "white"}, "group": 0, "id": "Marvolo", "label": "Marvolo", "shape": "dot", "size": 1}, {"font": {"color": "white"}, "group": 0, "id": "Lee", "label": "Lee", "shape": "dot", "size": 1}, {"font": {"color": "white"}, "group": 2, "id": "Aragog", "label": "Aragog", "shape": "dot", "size": 4}, {"font": {"color": "white"}, "group": 0, "id": "Salazar", "label": "Salazar", "shape": "dot", "size": 1}, {"font": {"color": "white"}, "group": 4, "id": "Minerva", "label": "Minerva", "shape": "dot", "size": 2}, {"font": {"color": "white"}, "group": 4, "id": "Cornelius", "label": "Cornelius", "shape": "dot", "size": 2}, {"font": {"color": "white"}, "group": 3, "id": "Errol", "label": "Errol", "shape": "dot", "size": 4}, {"font": {"color": "white"}, "group": 2, "id": "Alicia", "label": "Alicia", "shape": "dot", "size": 3}, {"font": {"color": "white"}, "group": 4, "id": "Parvati", "label": "Parvati", "shape": "dot", "size": 1}, {"font": {"color": "white"}, "group": 4, "id": "Albus", "label": "Albus", "shape": "dot", "size": 2}, {"font": {"color": "white"}, "group": 3, "id": "Millicent", "label": "Millicent", "shape": "dot", "size": 1}, {"font": {"color": "white"}, "group": 2, "id": "Katie", "label": "Katie", "shape": "dot", "size": 1}]);
edges = new vis.DataSet([{"from": "Harry", "to": "Petunia", "value": 52, "width": 1}, {"from": "Harry", "to": "Dudley", "value": 195, "width": 1}, {"from": "Harry", "to": "Snape", "value": 276, "width": 1}, {"from": "Harry", "to": "Hagrid", "value": 398, "width": 1}, {"from": "Harry", "to": "Hedwig", "value": 86, "width": 1}, {"from": "Harry", "to": "Voldemort", "value": 103, "width": 1}, {"from": "Harry", "to": "Vernon", "value": 5, "width": 1}, {"from": "Harry", "to": "Ron", "value": 2945, "width": 1}, {"from": "Harry", "to": "Dobby", "value": 478, "width": 1}, {"from": "Harry", "to": "Dumbledore", "value": 384, "width": 1}, {"from": "Harry", "to": "Hermione", "value": 288, "width": 1}, {"from": "Harry", "to": "Fred", "value": 326, "width": 1}, {"from": "Harry", "to": "Malfoy", "value": 509, "width": 1}, {"from": "Harry", "to": "Scabbers", "value": 5, "width": 1}, {"from": "Harry", "to": "Ginny", "value": 213, "width": 1}, {"from": "Harry", "to": "Percy", "value": 130, "width": 1}, {"from": "Harry", "to": "Charlie", "value": 18, "width": 1}, {"from": "Harry", "to": "Molly", "value": 10, "width": 1}, {"from": "Harry", "to": "Arthur", "value": 3, "width": 1}, {"from": "Harry", "to": "Seamus", "value": 18, "width": 1}, {"from": "Harry", "to": "Neville", "value": 64, "width": 1}, {"from": "Harry", "to": "Colin", "value": 164, "width": 1}, {"from": "Harry", "to": "Dean", "value": 19, "width": 1}, {"from": "Harry", "to": "Fang", "value": 111, "width": 1}, {"from": "Harry", "to": "Peeves", "value": 41, "width": 1}, {"from": "Harry", "to": "Bloody", "value": 6, "width": 1}, {"from": "Harry", "to": "Myrtle", "value": 147, "width": 1}, {"from": "Harry", "to": "Bill", "value": 4, "width": 1}, {"from": "Harry", "to": "Justin", "value": 134, "width": 1}, {"from": "Harry", "to": "Angelina", "value": 7, "width": 1}, {"from": "Harry", "to": "Oliver", "value": 8, "width": 1}, {"from": "Harry", "to": "Goyle", "value": 112, "width": 1}, {"from": "Harry", "to": "Hannah", "value": 26, "width": 1}, {"from": "Harry", "to": "Ernie", "value": 109, "width": 1}, {"from": "Harry", "to": "Fawkes", "value": 32, "width": 1}, {"from": "Harry", "to": "Crabbe", "value": 5, "width": 1}, {"from": "Harry", "to": "Marvolo", "value": 3, "width": 1}, {"from": "Harry", "to": "Lee", "value": 3, "width": 1}, {"from": "Harry", "to": "Aragog", "value": 72, "width": 1}, {"from": "Harry", "to": "Salazar", "value": 7, "width": 1}, {"from": "Petunia", "to": "Dudley", "value": 11, "width": 1}, {"from": "Petunia", "to": "Vernon", "value": 1, "width": 1}, {"from": "Petunia", "to": "Dobby", "value": 4, "width": 1}, {"from": "Dudley", "to": "Ron", "value": 20, "width": 1}, {"from": "Dudley", "to": "Dobby", "value": 5, "width": 1}, {"from": "Snape", "to": "Hagrid", "value": 12, "width": 1}, {"from": "Snape", "to": "Ron", "value": 91, "width": 1}, {"from": "Snape", "to": "Dumbledore", "value": 25, "width": 1}, {"from": "Snape", "to": "Minerva", "value": 5, "width": 1}, {"from": "Snape", "to": "Hermione", "value": 22, "width": 1}, {"from": "Snape", "to": "Malfoy", "value": 30, "width": 1}, {"from": "Snape", "to": "Neville", "value": 21, "width": 1}, {"from": "Snape", "to": "Goyle", "value": 6, "width": 1}, {"from": "Snape", "to": "Justin", "value": 10, "width": 1}, {"from": "Snape", "to": "Dean", "value": 5, "width": 1}, {"from": "Hagrid", "to": "Ron", "value": 144, "width": 1}, {"from": "Hagrid", "to": "Dobby", "value": 10, "width": 1}, {"from": "Hagrid", "to": "Fred", "value": 12, "width": 1}, {"from": "Hagrid", "to": "Ginny", "value": 4, "width": 1}, {"from": "Hagrid", "to": "Malfoy", "value": 16, "width": 1}, {"from": "Hagrid", "to": "Fang", "value": 34, "width": 1}, {"from": "Hagrid", "to": "Dumbledore", "value": 58, "width": 1}, {"from": "Hagrid", "to": "Hermione", "value": 26, "width": 1}, {"from": "Hagrid", "to": "Percy", "value": 10, "width": 1}, {"from": "Hagrid", "to": "Ernie", "value": 9, "width": 1}, {"from": "Hagrid", "to": "Justin", "value": 10, "width": 1}, {"from": "Hagrid", "to": "Neville", "value": 5, "width": 1}, {"from": "Hagrid", "to": "Cornelius", "value": 6, "width": 1}, {"from": "Hagrid", "to": "Dean", "value": 5, "width": 1}, {"from": "Hagrid", "to": "Aragog", "value": 20, "width": 1}, {"from": "Hedwig", "to": "Ron", "value": 59, "width": 1}, {"from": "Hedwig", "to": "Dobby", "value": 4, "width": 1}, {"from": "Hedwig", "to": "Fred", "value": 11, "width": 1}, {"from": "Voldemort", "to": "Dumbledore", "value": 23, "width": 1}, {"from": "Voldemort", "to": "Ginny", "value": 6, "width": 1}, {"from": "Voldemort", "to": "Malfoy", "value": 5, "width": 1}, {"from": "Ron", "to": "Dobby", "value": 20, "width": 1}, {"from": "Ron", "to": "Hermione", "value": 409, "width": 1}, {"from": "Ron", "to": "Fred", "value": 110, "width": 1}, {"from": "Ron", "to": "Errol", "value": 21, "width": 1}, {"from": "Ron", "to": "Percy", "value": 156, "width": 1}, {"from": "Ron", "to": "Scabbers", "value": 6, "width": 1}, {"from": "Ron", "to": "Ginny", "value": 106, "width": 1}, {"from": "Ron", "to": "Malfoy", "value": 212, "width": 1}, {"from": "Ron", "to": "Dumbledore", "value": 65, "width": 1}, {"from": "Ron", "to": "Neville", "value": 22, "width": 1}, {"from": "Ron", "to": "Goyle", "value": 70, "width": 1}, {"from": "Ron", "to": "Alicia", "value": 6, "width": 1}, {"from": "Ron", "to": "Colin", "value": 16, "width": 1}, {"from": "Ron", "to": "Fang", "value": 41, "width": 1}, {"from": "Ron", "to": "Myrtle", "value": 62, "width": 1}, {"from": "Ron", "to": "Bill", "value": 5, "width": 1}, {"from": "Ron", "to": "Crabbe", "value": 19, "width": 1}, {"from": "Ron", "to": "Seamus", "value": 13, "width": 1}, {"from": "Ron", "to": "Justin", "value": 22, "width": 1}, {"from": "Ron", "to": "Dean", "value": 24, "width": 1}, {"from": "Ron", "to": "Ernie", "value": 16, "width": 1}, {"from": "Ron", "to": "Hannah", "value": 5, "width": 1}, {"from": "Ron", "to": "Aragog", "value": 29, "width": 1}, {"from": "Ron", "to": "Fawkes", "value": 7, "width": 1}, {"from": "Dobby", "to": "Dumbledore", "value": 16, "width": 1}, {"from": "Dobby", "to": "Fred", "value": 5, "width": 1}, {"from": "Dobby", "to": "Colin", "value": 6, "width": 1}, {"from": "Dobby", "to": "Ginny", "value": 5, "width": 1}, {"from": "Dobby", "to": "Malfoy", "value": 22, "width": 1}, {"from": "Dumbledore", "to": "Malfoy", "value": 90, "width": 1}, {"from": "Dumbledore", "to": "Minerva", "value": 4, "width": 1}, {"from": "Dumbledore", "to": "Hermione", "value": 8, "width": 1}, {"from": "Dumbledore", "to": "Parvati", "value": 5, "width": 1}, {"from": "Dumbledore", "to": "Albus", "value": 11, "width": 1}, {"from": "Dumbledore", "to": "Colin", "value": 10, "width": 1}, {"from": "Dumbledore", "to": "Fawkes", "value": 3, "width": 1}, {"from": "Dumbledore", "to": "Cornelius", "value": 6, "width": 1}, {"from": "Dumbledore", "to": "Fang", "value": 4, "width": 1}, {"from": "Dumbledore", "to": "Goyle", "value": 4, "width": 1}, {"from": "Hermione", "to": "Percy", "value": 11, "width": 1}, {"from": "Hermione", "to": "Errol", "value": 11, "width": 1}, {"from": "Hermione", "to": "Neville", "value": 12, "width": 1}, {"from": "Hermione", "to": "Malfoy", "value": 21, "width": 1}, {"from": "Hermione", "to": "Bloody", "value": 5, "width": 1}, {"from": "Hermione", "to": "Peeves", "value": 17, "width": 1}, {"from": "Hermione", "to": "Myrtle", "value": 26, "width": 1}, {"from": "Hermione", "to": "Colin", "value": 6, "width": 1}, {"from": "Hermione", "to": "Seamus", "value": 6, "width": 1}, {"from": "Hermione", "to": "Millicent", "value": 12, "width": 1}, {"from": "Hermione", "to": "Justin", "value": 10, "width": 1}, {"from": "Hermione", "to": "Goyle", "value": 10, "width": 1}, {"from": "Hermione", "to": "Ginny", "value": 6, "width": 1}, {"from": "Fred", "to": "Percy", "value": 43, "width": 1}, {"from": "Fred", "to": "Ginny", "value": 13, "width": 1}, {"from": "Fred", "to": "Malfoy", "value": 21, "width": 1}, {"from": "Fred", "to": "Arthur", "value": 7, "width": 1}, {"from": "Fred", "to": "Colin", "value": 10, "width": 1}, {"from": "Fred", "to": "Alicia", "value": 6, "width": 1}, {"from": "Malfoy", "to": "Ginny", "value": 39, "width": 1}, {"from": "Malfoy", "to": "Arthur", "value": 5, "width": 1}, {"from": "Malfoy", "to": "Colin", "value": 5, "width": 1}, {"from": "Malfoy", "to": "Neville", "value": 9, "width": 1}, {"from": "Malfoy", "to": "Myrtle", "value": 6, "width": 1}, {"from": "Malfoy", "to": "Goyle", "value": 31, "width": 1}, {"from": "Malfoy", "to": "Percy", "value": 5, "width": 1}, {"from": "Malfoy", "to": "Ernie", "value": 6, "width": 1}, {"from": "Errol", "to": "Percy", "value": 3, "width": 1}, {"from": "Errol", "to": "Neville", "value": 5, "width": 1}, {"from": "Percy", "to": "Charlie", "value": 6, "width": 1}, {"from": "Percy", "to": "Ginny", "value": 20, "width": 1}, {"from": "Percy", "to": "Bill", "value": 5, "width": 1}, {"from": "Bill", "to": "Charlie", "value": 12, "width": 1}, {"from": "Bill", "to": "Ginny", "value": 9, "width": 1}, {"from": "Arthur", "to": "Molly", "value": 6, "width": 1}, {"from": "Ginny", "to": "Neville", "value": 3, "width": 1}, {"from": "Ginny", "to": "Myrtle", "value": 5, "width": 1}, {"from": "Ginny", "to": "Fawkes", "value": 4, "width": 1}, {"from": "Seamus", "to": "Dean", "value": 28, "width": 1}, {"from": "Seamus", "to": "Neville", "value": 5, "width": 1}, {"from": "Dean", "to": "Neville", "value": 17, "width": 1}, {"from": "Neville", "to": "Justin", "value": 6, "width": 1}, {"from": "Colin", "to": "Crabbe", "value": 6, "width": 1}, {"from": "Colin", "to": "Albus", "value": 6, "width": 1}, {"from": "Colin", "to": "Justin", "value": 5, "width": 1}, {"from": "Crabbe", "to": "Goyle", "value": 8, "width": 1}, {"from": "Goyle", "to": "Myrtle", "value": 4, "width": 1}, {"from": "Alicia", "to": "Katie", "value": 6, "width": 1}, {"from": "Peeves", "to": "Myrtle", "value": 15, "width": 1}, {"from": "Peeves", "to": "Justin", "value": 10, "width": 1}, {"from": "Justin", "to": "Ernie", "value": 11, "width": 1}, {"from": "Ernie", "to": "Hannah", "value": 6, "width": 1}, {"from": "Fawkes", "to": "Aragog", "value": 5, "width": 1}]);
nodeColors = {};
allNodes = nodes.get({ returnType: "Object" });
for (nodeId in allNodes) {
nodeColors[nodeId] = allNodes[nodeId].color;
}
allEdges = edges.get({ returnType: "Object" });
// adding nodes and edges to the graph
data = {nodes: nodes, edges: edges};
var options = {
"configure": {
"enabled": true,
"filter": "physics"
},
"edges": {
"color": {
"inherit": true
},
"smooth": {
"enabled": true,
"type": "dynamic"
}
},
"interaction": {
"dragNodes": true,
"hideEdgesOnDrag": false,
"hideNodesOnDrag": false
},
"physics": {
"enabled": true,
"forceAtlas2Based": {
"avoidOverlap": 0,
"centralGravity": 0.01,
"damping": 0.4,
"gravitationalConstant": -50,
"springConstant": 0.08,
"springLength": 50
},
"solver": "forceAtlas2Based",
"stabilization": {
"enabled": true,
"fit": true,
"iterations": 1000,
"onlyDynamicEdges": false,
"updateInterval": 50
}
}
};
// if this network requires displaying the configure window,
// put it in its div
options.configure["container"] = document.getElementById("config");
network = new vis.Network(container, data, options);
return network;
}
drawGraph();
</script>
</body>
</html> |