vis.js is a dynamic, browser-based visualization library
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

203 lines
8.5 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" HREF="favicon.ico">
<title>vis.js - A dynamic, browser based visualization library.</title>
<!-- Bootstrap core CSS -->
<link href="../css/bootstrap.css" rel="stylesheet">
<link href="../css/newdocs.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="../js/smooth-scroll.min.js"></script>
<script src="../js/googleAnalytics.js"></script>
<script language="JavaScript">
smoothScroll.init();
</script>
<style>
</style>
</head>
<!-- NAVBAR
================================================== -->
<body>
<div class="navbar-wrapper">
<div class="container">
<nav class="navbar navbar-inverse navbar-static-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar"
aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand hidden-sm" href="./index.html">vis.js</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="http://www.visjs.org/index.html#modules">Modules</a></li>
<li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon"
src="../img/external-link-icons/external-link-icon-white.png"></a>
</li>
<li><a href="http://www.visjs.org/blog.html">Blog</a></li>
<li><a href="http://www.visjs.org/index.html#download_install">Download</a></li>
<li><a href="http://www.visjs.org/showcase/index.html">Showcase</a></li>
<li><a href="http://www.visjs.org/index.html#contribute">Contribute</a></li>
<li><a href="http://www.visjs.org/featureRequests.html">Feature requests</a></li>
<li><a href="http://www.visjs.org/index.html#licenses">License</a></li>
</ul>
</div>
</div>
</nav>
</div>
</div>
<a href="https://github.com/almende/vis" class="hidden-xs hidden-sm hidden-md"><img
style="position: absolute; top: 0; right: 0; border: 0;"
src="https://camo.githubusercontent.com/38ef81f8aca64bb9a64448d0d70f1308ef5341ab/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6461726b626c75655f3132313632312e706e67"
alt="Fork me on GitHub"
data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png"></a>
<div class="container full">
<h1>Network</h1>
<p>As of 4.0, the network consists of individual modules which handle specific parts of the network. These modules
have their own docs, options, methods and events which you can access
by clicking on the modules in the list below.</p>
<h3>Modules</h3>
<table class="moduleTable">
<tr>
<td width="120px" class="gren"><a href="./canvas.html">canvas</a></td>
<td>Handles the HTML part of the network.</td>
</tr>
<tr>
<td><a href="./clustering.html">clustering</a></td>
<td>Provides the clustering api, giving users full control over the formed clusters.</td>
</tr>
<tr>
<td><a href="./configure.html">configure</a></td>
<td>Generates an interactive option editor with filtering.</td>
</tr>
<tr>
<td><a href="./edges.html">edges</a></td>
<td>Handles the creation and deletion of edges and contains the global edge options and styles.</td>
</tr>
<tr>
<td><a href="./groups.html">groups</a></td>
<td>Contains the groups and some options on how to handle nodes with non-existing groups.</td>
</tr>
<tr>
<td><a href="./interaction.html">interaction</a></td>
<td>Used for all user interaction with the network. Handles mouse and touch events as well as the navigation
buttons and the popups.
</td>
</tr>
<tr>
<td><a href="./layout.html">layout</a></td>
<td>Governs the initial and hierarchical positioning.</td>
</tr>
<tr>
<td><a href="./manipulation.html">manipulation</a></td>
<td>Supplies an API and optional GUI to alter the data in the network.</td>
</tr>
<tr>
<td><a href="./nodes.html">nodes</a></td>
<td>Handles the creation and deletion of nodes and contains the global node options and styles.</td>
</tr>
<tr>
<td><a href="./physics.html">physics</a></td>
<td>Does all the simulation moving the nodes and edges to their final positions, also governs
stabilization.
</td>
</tr>
<tr>
<td><a href="./rendering.html">rendering</a></td>
<td>Handles the rendering aspect of vis. It governs the render loop, it draws the nodes and edges and
provides events to allow users to hook into the drawing.
</td>
</tr>
<tr>
<td><a href="./selection.html">selection</a></td>
<td>Handles the selection of nodes and edges.</td>
</tr>
<tr>
<td><a href="./view.html">view</a></td>
<td>Acts as the camera that looks on the canvas. Does the animation, zooming and focusing.</td>
</tr>
</table>
<h3>All Methods</h3>
<p>This is a list of all the methods in the public API. They are collected here from all individual modules.</p>
<table class="moduleTable">
<tr class="header">
<td class="methodName">name</td>
<td>returns</td>
<td>description</td>
</tr>
<tr>
<td>destroy()</td>
<td class="mid">none</td>
<td>Remove the network from the DOM and remove all Hammer bindings and references.</td>
</tr>
<tr>
<td>setData({<br><code><i>nodes: vis DataSet/Array</i></code>,<br><code><i>edges: vis
DataSet/Arary</i></code><br>})
</td>
<td class="mid">none</td>
<td>Override all the data in the network. If stabilization is enabled in the <a href="physics.html">physics
module</a>, the network will stabilize again. This method is also performed when first initializing the
network.
</td>
</tr>
<tr>
<td>setOptions(<code>Object options</code>)</td>
<td class="mid">none</td>
<td>Set the options. All available options can be found in the modules above. Each module requires it's own
container with the module name to contain its options.
</td>
</tr>
</table>
<h3>All Events</h3>
<p>This is a list of all the events in the public API. They are collected here from all individual modules.</p>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="../js/ie10-viewport-bug-workaround.js"></script>