Spaces:
Sleeping
Sleeping
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <script>function neighbourhoodHighlight(params) { | |
| // console.log("in nieghbourhoodhighlight"); | |
| allNodes = nodes.get({ returnType: "Object" }); | |
| // originalNodes = JSON.parse(JSON.stringify(allNodes)); | |
| // if something is selected: | |
| if (params.nodes.length > 0) { | |
| highlightActive = true; | |
| var i, j; | |
| var selectedNode = params.nodes[0]; | |
| var degrees = 2; | |
| // mark all nodes as hard to read. | |
| for (let nodeId in allNodes) { | |
| // nodeColors[nodeId] = allNodes[nodeId].color; | |
| allNodes[nodeId].color = "rgba(200,200,200,0.5)"; | |
| if (allNodes[nodeId].hiddenLabel === undefined) { | |
| allNodes[nodeId].hiddenLabel = allNodes[nodeId].label; | |
| allNodes[nodeId].label = undefined; | |
| } | |
| } | |
| var connectedNodes = network.getConnectedNodes(selectedNode); | |
| var allConnectedNodes = []; | |
| // get the second degree nodes | |
| for (i = 1; i < degrees; i++) { | |
| for (j = 0; j < connectedNodes.length; j++) { | |
| allConnectedNodes = allConnectedNodes.concat( | |
| network.getConnectedNodes(connectedNodes[j]) | |
| ); | |
| } | |
| } | |
| // all second degree nodes get a different color and their label back | |
| for (i = 0; i < allConnectedNodes.length; i++) { | |
| // allNodes[allConnectedNodes[i]].color = "pink"; | |
| allNodes[allConnectedNodes[i]].color = "rgba(150,150,150,0.75)"; | |
| if (allNodes[allConnectedNodes[i]].hiddenLabel !== undefined) { | |
| allNodes[allConnectedNodes[i]].label = | |
| allNodes[allConnectedNodes[i]].hiddenLabel; | |
| allNodes[allConnectedNodes[i]].hiddenLabel = undefined; | |
| } | |
| } | |
| // all first degree nodes get their own color and their label back | |
| for (i = 0; i < connectedNodes.length; i++) { | |
| // allNodes[connectedNodes[i]].color = undefined; | |
| allNodes[connectedNodes[i]].color = nodeColors[connectedNodes[i]]; | |
| if (allNodes[connectedNodes[i]].hiddenLabel !== undefined) { | |
| allNodes[connectedNodes[i]].label = | |
| allNodes[connectedNodes[i]].hiddenLabel; | |
| allNodes[connectedNodes[i]].hiddenLabel = undefined; | |
| } | |
| } | |
| // the main node gets its own color and its label back. | |
| // allNodes[selectedNode].color = undefined; | |
| allNodes[selectedNode].color = nodeColors[selectedNode]; | |
| if (allNodes[selectedNode].hiddenLabel !== undefined) { | |
| allNodes[selectedNode].label = allNodes[selectedNode].hiddenLabel; | |
| allNodes[selectedNode].hiddenLabel = undefined; | |
| } | |
| } else if (highlightActive === true) { | |
| // console.log("highlightActive was true"); | |
| // reset all nodes | |
| for (let nodeId in allNodes) { | |
| // allNodes[nodeId].color = "purple"; | |
| allNodes[nodeId].color = nodeColors[nodeId]; | |
| // delete allNodes[nodeId].color; | |
| if (allNodes[nodeId].hiddenLabel !== undefined) { | |
| allNodes[nodeId].label = allNodes[nodeId].hiddenLabel; | |
| allNodes[nodeId].hiddenLabel = undefined; | |
| } | |
| } | |
| highlightActive = false; | |
| } | |
| // transform the object into an array | |
| var updateArray = []; | |
| if (params.nodes.length > 0) { | |
| for (let nodeId in allNodes) { | |
| if (allNodes.hasOwnProperty(nodeId)) { | |
| // console.log(allNodes[nodeId]); | |
| updateArray.push(allNodes[nodeId]); | |
| } | |
| } | |
| nodes.update(updateArray); | |
| } else { | |
| // console.log("Nothing was selected"); | |
| for (let nodeId in allNodes) { | |
| if (allNodes.hasOwnProperty(nodeId)) { | |
| // console.log(allNodes[nodeId]); | |
| // allNodes[nodeId].color = {}; | |
| updateArray.push(allNodes[nodeId]); | |
| } | |
| } | |
| nodes.update(updateArray); | |
| } | |
| } | |
| function filterHighlight(params) { | |
| allNodes = nodes.get({ returnType: "Object" }); | |
| // if something is selected: | |
| if (params.nodes.length > 0) { | |
| filterActive = true; | |
| let selectedNodes = params.nodes; | |
| // hiding all nodes and saving the label | |
| for (let nodeId in allNodes) { | |
| allNodes[nodeId].hidden = true; | |
| if (allNodes[nodeId].savedLabel === undefined) { | |
| allNodes[nodeId].savedLabel = allNodes[nodeId].label; | |
| allNodes[nodeId].label = undefined; | |
| } | |
| } | |
| for (let i=0; i < selectedNodes.length; i++) { | |
| allNodes[selectedNodes[i]].hidden = false; | |
| if (allNodes[selectedNodes[i]].savedLabel !== undefined) { | |
| allNodes[selectedNodes[i]].label = allNodes[selectedNodes[i]].savedLabel; | |
| allNodes[selectedNodes[i]].savedLabel = undefined; | |
| } | |
| } | |
| } else if (filterActive === true) { | |
| // reset all nodes | |
| for (let nodeId in allNodes) { | |
| allNodes[nodeId].hidden = false; | |
| if (allNodes[nodeId].savedLabel !== undefined) { | |
| allNodes[nodeId].label = allNodes[nodeId].savedLabel; | |
| allNodes[nodeId].savedLabel = undefined; | |
| } | |
| } | |
| filterActive = false; | |
| } | |
| // transform the object into an array | |
| var updateArray = []; | |
| if (params.nodes.length > 0) { | |
| for (let nodeId in allNodes) { | |
| if (allNodes.hasOwnProperty(nodeId)) { | |
| updateArray.push(allNodes[nodeId]); | |
| } | |
| } | |
| nodes.update(updateArray); | |
| } else { | |
| for (let nodeId in allNodes) { | |
| if (allNodes.hasOwnProperty(nodeId)) { | |
| updateArray.push(allNodes[nodeId]); | |
| } | |
| } | |
| nodes.update(updateArray); | |
| } | |
| } | |
| function selectNode(nodes) { | |
| network.selectNodes(nodes); | |
| neighbourhoodHighlight({ nodes: nodes }); | |
| return nodes; | |
| } | |
| function selectNodes(nodes) { | |
| network.selectNodes(nodes); | |
| filterHighlight({nodes: nodes}); | |
| return nodes; | |
| } | |
| function highlightFilter(filter) { | |
| let selectedNodes = [] | |
| let selectedProp = filter['property'] | |
| if (filter['item'] === 'node') { | |
| let allNodes = nodes.get({ returnType: "Object" }); | |
| for (let nodeId in allNodes) { | |
| if (allNodes[nodeId][selectedProp] && filter['value'].includes((allNodes[nodeId][selectedProp]).toString())) { | |
| selectedNodes.push(nodeId) | |
| } | |
| } | |
| } | |
| else if (filter['item'] === 'edge'){ | |
| let allEdges = edges.get({returnType: 'object'}); | |
| // check if the selected property exists for selected edge and select the nodes connected to the edge | |
| for (let edge in allEdges) { | |
| if (allEdges[edge][selectedProp] && filter['value'].includes((allEdges[edge][selectedProp]).toString())) { | |
| selectedNodes.push(allEdges[edge]['from']) | |
| selectedNodes.push(allEdges[edge]['to']) | |
| } | |
| } | |
| } | |
| selectNodes(selectedNodes) | |
| }</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/[email protected]/dist/css/bootstrap.min.css" | |
| rel="stylesheet" | |
| integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" | |
| crossorigin="anonymous" | |
| /> | |
| <script | |
| src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" | |
| integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf" | |
| crossorigin="anonymous" | |
| ></script> | |
| <center> | |
| <h1></h1> | |
| </center> | |
| <style type="text/css"> | |
| #mynetwork { | |
| width: 1000px; | |
| height: 700px; | |
| background-color: #222222; | |
| border: 1px solid lightgray; | |
| position: relative; | |
| float: left; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="card" style="width: 100%"> | |
| <div id="mynetwork" class="card-body"></div> | |
| </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([{"color": "#97c2fc", "font": {"color": "white"}, "id": "Robin", "label": "Robin", "shape": "dot", "size": 25}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Ted", "label": "Ted", "shape": "dot", "size": 37}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Lily", "label": "Lily", "shape": "dot", "size": 25}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Marshall", "label": "Marshall", "shape": "dot", "size": 35}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Victoria", "label": "Victoria", "shape": "dot", "size": 9}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Barney", "label": "Barney", "shape": "dot", "size": 21}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Sandy", "label": "Sandy", "shape": "dot", "size": 9}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Carlos", "label": "Carlos", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Mary", "label": "Mary", "shape": "dot", "size": 7}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Derek", "label": "Derek", "shape": "dot", "size": 5}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Mike", "label": "Mike", "shape": "dot", "size": 5}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Carl", "label": "Carl", "shape": "dot", "size": 5}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Elvis", "label": "Elvis", "shape": "dot", "size": 5}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Amanda", "label": "Amanda", "shape": "dot", "size": 4}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Trudy", "label": "Trudy", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Brian", "label": "Brian", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Claudia", "label": "Claudia", "shape": "dot", "size": 7}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Gatsby", "label": "Gatsby", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Booger", "label": "Booger", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Denise", "label": "Denise", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Natalie", "label": "Natalie", "shape": "dot", "size": 5}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Ellen", "label": "Ellen", "shape": "dot", "size": 3}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Stuart", "label": "Stuart", "shape": "dot", "size": 5}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Rivers", "label": "Rivers", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Ranjit", "label": "Ranjit", "shape": "dot", "size": 7}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Lou", "label": "Lou", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Valerie", "label": "Valerie", "shape": "dot", "size": 4}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Walter", "label": "Walter", "shape": "dot", "size": 3}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Tony", "label": "Tony", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Buttercup", "label": "Buttercup", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Kelly", "label": "Kelly", "shape": "dot", "size": 4}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Van", "label": "Van", "shape": "dot", "size": 4}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Billy", "label": "Billy", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Lando", "label": "Lando", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Yasmine", "label": "Yasmine", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Janice", "label": "Janice", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Shannon", "label": "Shannon", "shape": "dot", "size": 7}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Gabrielle", "label": "Gabrielle", "shape": "dot", "size": 5}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Katie", "label": "Katie", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Stepford", "label": "Stepford", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Tracey", "label": "Tracey", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Gretel", "label": "Gretel", "shape": "dot", "size": 3}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Emilio", "label": "Emilio", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Sergei", "label": "Sergei", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "O\u0027Brien", "label": "O\u0027Brien", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Marcus", "label": "Marcus", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Judy", "label": "Judy", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Sascha", "label": "Sascha", "shape": "dot", "size": 3}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Austin", "label": "Austin", "shape": "dot", "size": 3}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Vampire", "label": "Vampire", "shape": "dot", "size": 3}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Janet", "label": "Janet", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Matson", "label": "Matson", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Mayo", "label": "Mayo", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Bilson", "label": "Bilson", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Bong", "label": "Bong", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Chung", "label": "Chung", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Claire", "label": "Claire", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Blauman", "label": "Blauman", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Julia", "label": "Julia", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Norah", "label": "Norah", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Svetlana", "label": "Svetlana", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Ray", "label": "Ray", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Marybeth", "label": "Marybeth", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Luke", "label": "Luke", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Kendall", "label": "Kendall", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Misty", "label": "Misty", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Greg", "label": "Greg", "shape": "dot", "size": 3}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Heather", "label": "Heather", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Punky", "label": "Punky", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "John", "label": "John", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Sharon", "label": "Sharon", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Samantha", "label": "Samantha", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Windjammer", "label": "Windjammer", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Max", "label": "Max", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Barnacle", "label": "Barnacle", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Cher", "label": "Cher", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Ewoks", "label": "Ewoks", "shape": "dot", "size": 3}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Sonny", "label": "Sonny", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Kit", "label": "Kit", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Belle", "label": "Belle", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Krav", "label": "Krav", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Laura", "label": "Laura", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Erica", "label": "Erica", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Keith", "label": "Keith", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Hansel", "label": "Hansel", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Kim", "label": "Kim", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Otis", "label": "Otis", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Ictor", "label": "Ictor", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Tori", "label": "Tori", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Vicky", "label": "Vicky", "shape": "dot", "size": 2}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Ethel", "label": "Ethel", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Sadie", "label": "Sadie", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Rufus", "label": "Rufus", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Troofus", "label": "Troofus", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Louise", "label": "Louise", "shape": "dot", "size": 1}, {"color": "#97c2fc", "font": {"color": "white"}, "id": "Thelma", "label": "Thelma", "shape": "dot", "size": 1}]); | |
| edges = new vis.DataSet([{"from": "Robin", "to": "Ted", "value": 7, "width": 1}, {"from": "Robin", "to": "Lily", "value": 3, "width": 1}, {"from": "Robin", "to": "Marshall", "value": 4, "width": 1}, {"from": "Robin", "to": "Victoria", "value": 30, "width": 1}, {"from": "Robin", "to": "Barney", "value": 27, "width": 1}, {"from": "Robin", "to": "Sandy", "value": 24, "width": 1}, {"from": "Robin", "to": "Carlos", "value": 16, "width": 1}, {"from": "Robin", "to": "Mary", "value": 12, "width": 1}, {"from": "Robin", "to": "Derek", "value": 8, "width": 1}, {"from": "Robin", "to": "Mike", "value": 7, "width": 1}, {"from": "Robin", "to": "Carl", "value": 7, "width": 1}, {"from": "Robin", "to": "Elvis", "value": 6, "width": 1}, {"from": "Robin", "to": "Amanda", "value": 6, "width": 1}, {"from": "Robin", "to": "Trudy", "value": 6, "width": 1}, {"from": "Robin", "to": "Brian", "value": 4, "width": 1}, {"from": "Robin", "to": "Claudia", "value": 4, "width": 1}, {"from": "Robin", "to": "Gatsby", "value": 3, "width": 1}, {"from": "Robin", "to": "Booger", "value": 3, "width": 1}, {"from": "Robin", "to": "Denise", "value": 3, "width": 1}, {"from": "Robin", "to": "Natalie", "value": 2, "width": 1}, {"from": "Robin", "to": "Ellen", "value": 3, "width": 1}, {"from": "Robin", "to": "Stuart", "value": 2, "width": 1}, {"from": "Robin", "to": "Rivers", "value": 2, "width": 1}, {"from": "Robin", "to": "Ranjit", "value": 2, "width": 1}, {"from": "Robin", "to": "Lou", "value": 2, "width": 1}, {"from": "Ted", "to": "Barney", "value": 3, "width": 1}, {"from": "Ted", "to": "Lily", "value": 5, "width": 1}, {"from": "Ted", "to": "Marshall", "value": 2, "width": 1}, {"from": "Ted", "to": "Victoria", "value": 64, "width": 1}, {"from": "Ted", "to": "Mary", "value": 30, "width": 1}, {"from": "Ted", "to": "Claudia", "value": 23, "width": 1}, {"from": "Ted", "to": "Valerie", "value": 16, "width": 1}, {"from": "Ted", "to": "Ellen", "value": 15, "width": 1}, {"from": "Ted", "to": "Sandy", "value": 14, "width": 1}, {"from": "Ted", "to": "Carlos", "value": 12, "width": 1}, {"from": "Ted", "to": "Ranjit", "value": 10, "width": 1}, {"from": "Ted", "to": "Walter", "value": 12, "width": 1}, {"from": "Ted", "to": "Tony", "value": 11, "width": 1}, {"from": "Ted", "to": "Buttercup", "value": 10, "width": 1}, {"from": "Ted", "to": "Carl", "value": 8, "width": 1}, {"from": "Ted", "to": "Amanda", "value": 8, "width": 1}, {"from": "Ted", "to": "Kelly", "value": 8, "width": 1}, {"from": "Ted", "to": "Stuart", "value": 8, "width": 1}, {"from": "Ted", "to": "Van", "value": 7, "width": 1}, {"from": "Ted", "to": "Billy", "value": 6, "width": 1}, {"from": "Ted", "to": "Lando", "value": 6, "width": 1}, {"from": "Ted", "to": "Yasmine", "value": 5, "width": 1}, {"from": "Ted", "to": "Derek", "value": 5, "width": 1}, {"from": "Ted", "to": "Janice", "value": 5, "width": 1}, {"from": "Ted", "to": "Elvis", "value": 4, "width": 1}, {"from": "Ted", "to": "Shannon", "value": 4, "width": 1}, {"from": "Ted", "to": "Natalie", "value": 2, "width": 1}, {"from": "Ted", "to": "Gabrielle", "value": 3, "width": 1}, {"from": "Ted", "to": "Katie", "value": 3, "width": 1}, {"from": "Ted", "to": "Stepford", "value": 3, "width": 1}, {"from": "Ted", "to": "Lou", "value": 3, "width": 1}, {"from": "Ted", "to": "Tracey", "value": 2, "width": 1}, {"from": "Ted", "to": "Gretel", "value": 2, "width": 1}, {"from": "Ted", "to": "Emilio", "value": 2, "width": 1}, {"from": "Ted", "to": "Sergei", "value": 2, "width": 1}, {"from": "Ted", "to": "O\u0027Brien", "value": 2, "width": 1}, {"from": "Lily", "to": "Marshall", "value": 3, "width": 1}, {"from": "Lily", "to": "Barney", "value": 3, "width": 1}, {"from": "Lily", "to": "Mary", "value": 10, "width": 1}, {"from": "Lily", "to": "Van", "value": 9, "width": 1}, {"from": "Lily", "to": "Sandy", "value": 9, "width": 1}, {"from": "Lily", "to": "Valerie", "value": 7, "width": 1}, {"from": "Lily", "to": "Claudia", "value": 6, "width": 1}, {"from": "Lily", "to": "Gabrielle", "value": 5, "width": 1}, {"from": "Lily", "to": "Ranjit", "value": 5, "width": 1}, {"from": "Lily", "to": "Mike", "value": 4, "width": 1}, {"from": "Lily", "to": "Stuart", "value": 4, "width": 1}, {"from": "Lily", "to": "Marcus", "value": 4, "width": 1}, {"from": "Lily", "to": "Kelly", "value": 4, "width": 1}, {"from": "Lily", "to": "Elvis", "value": 3, "width": 1}, {"from": "Lily", "to": "Judy", "value": 3, "width": 1}, {"from": "Lily", "to": "Shannon", "value": 3, "width": 1}, {"from": "Lily", "to": "Sascha", "value": 3, "width": 1}, {"from": "Lily", "to": "Victoria", "value": 3, "width": 1}, {"from": "Lily", "to": "Austin", "value": 3, "width": 1}, {"from": "Lily", "to": "Vampire", "value": 2, "width": 1}, {"from": "Lily", "to": "Janet", "value": 2, "width": 1}, {"from": "Lily", "to": "Matson", "value": 2, "width": 1}, {"from": "Lily", "to": "Mayo", "value": 2, "width": 1}, {"from": "Marshall", "to": "Barney", "value": 3, "width": 1}, {"from": "Marshall", "to": "Victoria", "value": 11, "width": 1}, {"from": "Marshall", "to": "Sandy", "value": 9, "width": 1}, {"from": "Marshall", "to": "Van", "value": 6, "width": 1}, {"from": "Marshall", "to": "Stuart", "value": 6, "width": 1}, {"from": "Marshall", "to": "Claudia", "value": 6, "width": 1}, {"from": "Marshall", "to": "Amanda", "value": 6, "width": 1}, {"from": "Marshall", "to": "Sascha", "value": 5, "width": 1}, {"from": "Marshall", "to": "Mary", "value": 5, "width": 1}, {"from": "Marshall", "to": "Bilson", "value": 4, "width": 1}, {"from": "Marshall", "to": "Tracey", "value": 4, "width": 1}, {"from": "Marshall", "to": "Bong", "value": 4, "width": 1}, {"from": "Marshall", "to": "Austin", "value": 4, "width": 1}, {"from": "Marshall", "to": "Valerie", "value": 4, "width": 1}, {"from": "Marshall", "to": "Carl", "value": 4, "width": 1}, {"from": "Marshall", "to": "Derek", "value": 3, "width": 1}, {"from": "Marshall", "to": "Chung", "value": 3, "width": 1}, {"from": "Marshall", "to": "Claire", "value": 3, "width": 1}, {"from": "Marshall", "to": "Blauman", "value": 3, "width": 1}, {"from": "Marshall", "to": "Julia", "value": 3, "width": 1}, {"from": "Marshall", "to": "Kelly", "value": 3, "width": 1}, {"from": "Marshall", "to": "Denise", "value": 3, "width": 1}, {"from": "Marshall", "to": "Norah", "value": 3, "width": 1}, {"from": "Marshall", "to": "Shannon", "value": 3, "width": 1}, {"from": "Marshall", "to": "Judy", "value": 2, "width": 1}, {"from": "Marshall", "to": "Marcus", "value": 2, "width": 1}, {"from": "Marshall", "to": "Svetlana", "value": 2, "width": 1}, {"from": "Marshall", "to": "Ray", "value": 2, "width": 1}, {"from": "Marshall", "to": "Ranjit", "value": 2, "width": 1}, {"from": "Marshall", "to": "Matson", "value": 2, "width": 1}, {"from": "Marshall", "to": "Marybeth", "value": 2, "width": 1}, {"from": "Marshall", "to": "Luke", "value": 2, "width": 1}, {"from": "Barney", "to": "Mary", "value": 24, "width": 1}, {"from": "Barney", "to": "Shannon", "value": 13, "width": 1}, {"from": "Barney", "to": "Victoria", "value": 9, "width": 1}, {"from": "Barney", "to": "Sandy", "value": 8, "width": 1}, {"from": "Barney", "to": "Claudia", "value": 8, "width": 1}, {"from": "Barney", "to": "Ranjit", "value": 5, "width": 1}, {"from": "Barney", "to": "Elvis", "value": 5, "width": 1}, {"from": "Barney", "to": "Walter", "value": 4, "width": 1}, {"from": "Barney", "to": "Kendall", "value": 4, "width": 1}, {"from": "Barney", "to": "Misty", "value": 3, "width": 1}, {"from": "Barney", "to": "Carl", "value": 3, "width": 1}, {"from": "Barney", "to": "Sascha", "value": 3, "width": 1}, {"from": "Barney", "to": "Marybeth", "value": 3, "width": 1}, {"from": "Barney", "to": "Derek", "value": 3, "width": 1}, {"from": "Barney", "to": "Greg", "value": 3, "width": 1}, {"from": "Barney", "to": "Heather", "value": 3, "width": 1}, {"from": "Barney", "to": "Sergei", "value": 3, "width": 1}, {"from": "Victoria", "to": "Elvis", "value": 5, "width": 1}, {"from": "Victoria", "to": "Shannon", "value": 4, "width": 1}, {"from": "Victoria", "to": "Claudia", "value": 3, "width": 1}, {"from": "Victoria", "to": "Punky", "value": 2, "width": 1}, {"from": "Mary", "to": "Sandy", "value": 22, "width": 1}, {"from": "Mary", "to": "Vampire", "value": 3, "width": 1}, {"from": "Sandy", "to": "Rivers", "value": 5, "width": 1}, {"from": "Sandy", "to": "Vampire", "value": 3, "width": 1}, {"from": "Sandy", "to": "Mike", "value": 2, "width": 1}, {"from": "Claudia", "to": "Stuart", "value": 23, "width": 1}, {"from": "Valerie", "to": "Van", "value": 7, "width": 1}, {"from": "Ellen", "to": "John", "value": 3, "width": 1}, {"from": "Shannon", "to": "Greg", "value": 7, "width": 1}, {"from": "Shannon", "to": "Sharon", "value": 3, "width": 1}, {"from": "Ranjit", "to": "Derek", "value": 5, "width": 1}, {"from": "Ranjit", "to": "Natalie", "value": 2, "width": 1}, {"from": "Walter", "to": "Samantha", "value": 3, "width": 1}, {"from": "Carl", "to": "Windjammer", "value": 4, "width": 1}, {"from": "Amanda", "to": "Kendall", "value": 4, "width": 1}, {"from": "Kelly", "to": "Gabrielle", "value": 2, "width": 1}, {"from": "Greg", "to": "Max", "value": 2, "width": 1}, {"from": "Mike", "to": "Barnacle", "value": 6, "width": 1}, {"from": "Mike", "to": "Gretel", "value": 4, "width": 1}, {"from": "Cher", "to": "Ewoks", "value": 6, "width": 1}, {"from": "Cher", "to": "Sonny", "value": 5, "width": 1}, {"from": "Ewoks", "to": "Sonny", "value": 3, "width": 1}, {"from": "Ewoks", "to": "Kit", "value": 2, "width": 1}, {"from": "Belle", "to": "Natalie", "value": 6, "width": 1}, {"from": "Natalie", "to": "Krav", "value": 3, "width": 1}, {"from": "Gabrielle", "to": "Laura", "value": 2, "width": 1}, {"from": "Gabrielle", "to": "Erica", "value": 2, "width": 1}, {"from": "Brian", "to": "Keith", "value": 3, "width": 1}, {"from": "Austin", "to": "Claire", "value": 3, "width": 1}, {"from": "Gretel", "to": "Hansel", "value": 2, "width": 1}, {"from": "Kim", "to": "Otis", "value": 3, "width": 1}, {"from": "Misty", "to": "Heather", "value": 2, "width": 1}, {"from": "Ictor", "to": "Tori", "value": 2, "width": 1}, {"from": "Ictor", "to": "Vicky", "value": 2, "width": 1}, {"from": "Tori", "to": "Vicky", "value": 2, "width": 1}, {"from": "Ethel", "to": "Sadie", "value": 2, "width": 1}, {"from": "Rufus", "to": "Troofus", "value": 2, "width": 1}, {"from": "Louise", "to": "Thelma", "value": 2, "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": false | |
| }, | |
| "edges": { | |
| "color": { | |
| "inherit": true | |
| }, | |
| "smooth": { | |
| "enabled": true, | |
| "type": "dynamic" | |
| } | |
| }, | |
| "interaction": { | |
| "dragNodes": true, | |
| "hideEdgesOnDrag": false, | |
| "hideNodesOnDrag": false | |
| }, | |
| "physics": { | |
| "enabled": true, | |
| "stabilization": { | |
| "enabled": true, | |
| "fit": true, | |
| "iterations": 1000, | |
| "onlyDynamicEdges": false, | |
| "updateInterval": 50 | |
| } | |
| } | |
| }; | |
| network = new vis.Network(container, data, options); | |
| return network; | |
| } | |
| drawGraph(); | |
| </script> | |
| </body> | |
| </html> |