<!doctype html>
							 | 
						|
								<html>
							 | 
						|
								<head>
							 | 
						|
								  <title>Network | Basic usage</title>
							 | 
						|
								
							 | 
						|
								  <script type="text/javascript" src="../../dist/vis.js"></script>
							 | 
						|
								  <link href="../../dist/vis.css" rel="stylesheet" type="text/css" />
							 | 
						|
								
							 | 
						|
								  <style type="text/css">
							 | 
						|
								    #mynetwork {
							 | 
						|
								      width: 600px;
							 | 
						|
								      height: 400px;
							 | 
						|
								      border: 1px solid lightgray;
							 | 
						|
								    }
							 | 
						|
								  </style>
							 | 
						|
								<body>
							 | 
						|
								
							 | 
						|
								<div id="mynetwork"></div>
							 | 
						|
								
							 | 
						|
								<script type="text/javascript">
							 | 
						|
								  // create an array with nodes
							 | 
						|
								  var nodesDS = new vis.DataSet();
							 | 
						|
								
							 | 
						|
								  var nodes = [
							 | 
						|
								    {id: 1, label: 'Node 1', value:3, title:'hello world', color:'red'},
							 | 
						|
								    {id: 2, label: 'Node 2', value:1, group:'bla'},
							 | 
						|
								    {id: 3, label: 'Node 3', value:5},
							 | 
						|
								    {id: 4, value:3},
							 | 
						|
								    {id: 5, label: 'Node 5', value:2}
							 | 
						|
								  ];
							 | 
						|
								
							 | 
						|
								  // create an array with edges
							 | 
						|
								  var edges = new vis.DataSet([
							 | 
						|
								    {from: 1, to: 1},
							 | 
						|
								    {from: 1, to: 3,id:'e1', dashes:{pattern:[10,15,2,5]}},
							 | 
						|
								    {from: 1, to: 2},
							 | 
						|
								    {from: 2, to: 4},
							 | 
						|
								    {from: 2, to: 5}
							 | 
						|
								  ]);
							 | 
						|
								
							 | 
						|
								  // create a network
							 | 
						|
								  var container = document.getElementById('mynetwork');
							 | 
						|
								  nodesDS.add(nodes);
							 | 
						|
								  var data = {
							 | 
						|
								    nodes: nodesDS,
							 | 
						|
								    edges: edges
							 | 
						|
								  };
							 | 
						|
								  var options = {
							 | 
						|
								    edges:{color:'red'}
							 | 
						|
								  }
							 | 
						|
								  var network = new vis.Network(container, data, options);
							 | 
						|
								//    network.setOptions({nodes:{color:'red'}})
							 | 
						|
								  nodesDS.update({id:1, color:undefined,label:'hi'});
							 | 
						|
								</script>
							 | 
						|
								<pre>
							 | 
						|
								var options = {
							 | 
						|
								  manipulation: 'hello',
							 | 
						|
								  physics:{barnesHut:{gravitationslPull:34}, solver:'banana'},
							 | 
						|
								  groups:{'bla':{color:{backsground:'red'}, borderWidth:5}}
							 | 
						|
								}
							 | 
						|
								  </pre>
							 | 
						|
								</body>
							 | 
						|
								</html>
							 |