UNPKG

visjs-network

Version:

A dynamic, browser-based network visualization library.

28 lines (27 loc) 1.32 kB
<!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-network.min.css'> <script src='../../datasources/WorldCup2014.js'></script> <style type='text/css'> #mynetwork { width: 800px; height: 800px; border: 1px solid lightgray; } </style> </head> <body> <h2>Dynamic Data - Neighbourhood Highlight</h2> <div style='width:800px; font-size:14px;'> This example shows the power of the DataSet. Once a node is clicked, all nodes are greyed out except for the first and second order connected nodes. In this example we show how you can determine the order of connection per node as well as applying individual styling to the nodes based on whether or not they are connected to the selected node. The code doing the highlighting only takes about 1ms, the rest of the time is the redrawing of the network (9200 edges..). <br/><br/> </div> <div id='mynetwork'></div> <script src='./index.js' type='text/javascript'></script> </body> </html>