diff options
Diffstat (limited to 'www/lib/vis/examples/network/edgeStyles/smoothWorldCup.html')
| -rw-r--r-- | www/lib/vis/examples/network/edgeStyles/smoothWorldCup.html | 97 |
1 files changed, 97 insertions, 0 deletions
diff --git a/www/lib/vis/examples/network/edgeStyles/smoothWorldCup.html b/www/lib/vis/examples/network/edgeStyles/smoothWorldCup.html new file mode 100644 index 00000000..12846011 --- /dev/null +++ b/www/lib/vis/examples/network/edgeStyles/smoothWorldCup.html @@ -0,0 +1,97 @@ +<!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; + } + #optionsContainer { + height:280px; + } + </style> + <script src="../../googleAnalytics.js"></script> +</head> + +<body> + +<h2>Static smooth curves - World Cup Network</h2> + +<div style="width:700px; font-size:14px;"> + The static smooth curves are based only on the positions of the connected + nodes. + There are multiple ways to determine the way this curve is drawn. + This example shows the effect of the different types on a large network. + <br/> <br/> + Also shown in this example is the inheritColor option of the edges as well as + the roundness factor. Because the physics has been disabled, the dynamic smooth curves do not work here. +</div> + +<div id="optionsContainer"></div> + +<div id="mynetwork"></div> + +<script type="text/javascript"> + var network; + + function redrawAll() { + var container = document.getElementById('mynetwork'); + var options = { + nodes: { + shape: 'dot', + scaling: { + min: 10, + max: 30 + }, + font: { + size: 12, + face: 'Tahoma' + } + }, + edges: { + color:{inherit:true}, + width: 0.15, + smooth: { + type: 'continuous' + } + }, + interaction: { + hideEdgesOnDrag: true, + tooltipDelay: 200 + }, + configure: { + filter: function (option, path) { + if (option === 'inherit') {return true;} + if (option === 'type' && path.indexOf("smooth") !== -1) {return true;} + if (option === 'roundness') {return true;} + if (option === 'hideEdgesOnDrag') {return true;} + if (option === 'hideNodesOnDrag') {return true;} + return false; + }, + container: document.getElementById('optionsContainer'), + showButton: false + }, + physics: false + }; + + var data = {nodes:nodes, edges:edges}; + // Note: data is coming from ./data/WorldCup2014.js + network = new vis.Network(container, data, options); + } + + redrawAll() + +</script> + +</body> +</html> |
