Mon 21 Jul 22:43:21 CEST 2025
This commit is contained in:
		
							parent
							
								
									ce6662d63c
								
							
						
					
					
						commit
						109c684a93
					
				
							
								
								
									
										61
									
								
								js/dos/ext/vis/examples/network/edgeStyles/arrows.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										61
									
								
								js/dos/ext/vis/examples/network/edgeStyles/arrows.html
									
									
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,61 @@ | ||||||
|  | <!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> | ||||||
|  | </head> | ||||||
|  | <body> | ||||||
|  | 
 | ||||||
|  | <p> | ||||||
|  |   There are a lot of options with arrows! They can also be combined with dashed lines. | ||||||
|  | </p> | ||||||
|  | 
 | ||||||
|  | <div id="mynetwork"></div> | ||||||
|  | 
 | ||||||
|  | <script type="text/javascript"> | ||||||
|  |   // create an array with nodes | ||||||
|  |   var nodes = new vis.DataSet([ | ||||||
|  |     {id: 1, label: 'Node 1'}, | ||||||
|  |     {id: 2, label: 'Node 2'}, | ||||||
|  |     {id: 3, label: 'Node 3'}, | ||||||
|  |     {id: 4, label: 'Node 4'}, | ||||||
|  |     {id: 5, label: 'Node 5'}, | ||||||
|  |     {id: 6, label: 'Node 6'}, | ||||||
|  |     {id: 7, label: 'Node 7'}, | ||||||
|  |     {id: 8, label: 'Node 8'} | ||||||
|  |   ]); | ||||||
|  | 
 | ||||||
|  |   // create an array with edges | ||||||
|  |   var edges = new vis.DataSet([ | ||||||
|  |     {from: 1, to: 8, arrows:'to', dashes:true}, | ||||||
|  |     {from: 1, to: 3, arrows:'to'}, | ||||||
|  |     {from: 1, to: 2, arrows:'to, from'}, | ||||||
|  |     {from: 2, to: 4, arrows:'to, middle'}, | ||||||
|  |     {from: 2, to: 5, arrows:'to, middle, from'}, | ||||||
|  |     {from: 5, to: 6, arrows:{to:{scaleFactor:2}}}, | ||||||
|  |     {from: 6, to: 7, arrows:{middle:{scaleFactor:0.5},from:true}} | ||||||
|  |   ]); | ||||||
|  | 
 | ||||||
|  |   // create a network | ||||||
|  |   var container = document.getElementById('mynetwork'); | ||||||
|  |   var data = { | ||||||
|  |     nodes: nodes, | ||||||
|  |     edges: edges | ||||||
|  |   }; | ||||||
|  |   var options = {}; | ||||||
|  |   var network = new vis.Network(container, data, options); | ||||||
|  | </script> | ||||||
|  | 
 | ||||||
|  | <script src="../../googleAnalytics.js"></script> | ||||||
|  | </body> | ||||||
|  | </html> | ||||||
		Loading…
	
		Reference in New Issue
	
	Block a user