summaryrefslogtreecommitdiff
path: root/www/lib/vis/examples/network/exampleApplications/worldCupPerformance.html
diff options
context:
space:
mode:
Diffstat (limited to 'www/lib/vis/examples/network/exampleApplications/worldCupPerformance.html')
-rw-r--r--www/lib/vis/examples/network/exampleApplications/worldCupPerformance.html98
1 files changed, 98 insertions, 0 deletions
diff --git a/www/lib/vis/examples/network/exampleApplications/worldCupPerformance.html b/www/lib/vis/examples/network/exampleApplications/worldCupPerformance.html
new file mode 100644
index 00000000..191ad22d
--- /dev/null
+++ b/www/lib/vis/examples/network/exampleApplications/worldCupPerformance.html
@@ -0,0 +1,98 @@
+<!doctype html>
+<!-- saved from url=(0044)http://kenedict.com/networks/worldcup14/vis/ , thanks Andre!-->
+<html>
+<head>
+ <meta http-equiv="content-type" content="text/html; charset=UTF8">
+ <title>Network | Static smooth curves - World Cup Network</title>
+
+ <script type="text/javascript" src="../../../dist/vis.js"></script>
+ <link type="text/css" rel="stylesheet" href="../../../dist/vis.css">
+
+ <script src="../datasources/WorldCup2014.js"></script>
+
+ <style type="text/css">
+ #mynetwork {
+ width: 800px;
+ height: 800px;
+ border: 1px solid lightgray;
+ }
+ </style>
+ <script src="../../googleAnalytics.js"></script>
+</head>
+
+<body>
+
+<h2>Performance - World Cup Network</h2>
+
+<div style="width:700px; font-size:14px;">
+ This example shows the performance of vis with a larger network. The edges in
+ particular (~9200) are very computationally intensive
+ to draw. Drag and hold the graph to see the performance difference if the
+ edges are hidden.
+ <br/><br/>
+ We use the following physics configuration: <br/>
+ <code>{barnesHut: {gravitationalConstant: -80000, springConstant: 0.001,
+ springLength: 200}}</code>
+ <br/><br/>
+</div>
+
+<div id="mynetwork"></div>
+
+<script type="text/javascript">
+ var network;
+
+
+ function redrawAll() {
+ // remove positoins
+ for (var i = 0; i < nodes.length; i++) {
+ delete nodes[i].x;
+ delete nodes[i].y;
+ }
+
+ // create a network
+ var container = document.getElementById('mynetwork');
+ var data = {
+ nodes: nodes,
+ edges: edges
+ };
+ var options = {
+ nodes: {
+ shape: 'dot',
+ scaling: {
+ min: 10,
+ max: 30
+ },
+ font: {
+ size: 12,
+ face: 'Tahoma'
+ }
+ },
+ edges: {
+ width: 0.15,
+ color: {inherit: 'from'},
+ smooth: {
+ type: 'continuous'
+ }
+ },
+ physics: {
+ stabilization: false,
+ barnesHut: {
+ gravitationalConstant: -80000,
+ springConstant: 0.001,
+ springLength: 200
+ }
+ },
+ interaction: {
+ tooltipDelay: 200,
+ hideEdgesOnDrag: true
+ }
+ };
+
+ // Note: data is coming from ./datasources/WorldCup2014.js
+ network = new vis.Network(container, data, options);
+ }
+
+ redrawAll()
+</script>
+</body>
+</html>