| <!doctype html> | |
| <html> | |
| <head> | |
|   <title>Network | Label stroke</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: 400px; | |
|       height: 400px; | |
|       border: 1px solid lightgray; | |
|       background: #d1d1d1; | |
|     } | |
|   </style> | |
| </head> | |
| 
 | |
| <body> | |
| 
 | |
| <div id="mynetwork"></div> | |
| 
 | |
| <script type="text/javascript"> | |
|   // create an array with nodes | |
|   var nodes = [ | |
|     {id: 1, label: 'Node 1', fontStrokeWidth : 5, fontStrokeColor: 'white'}, | |
|     {id: 2, label: 'Node 2'}, | |
|     {id: 3, label: 'Node 3'}, | |
|     {id: 4, label: 'Node 4'}, | |
|     {id: 5, label: 'Node 5'} | |
|   ]; | |
| 
 | |
|   // create an array with edges | |
|   var edges = [ | |
|     {from: 1, to: 2, label: 'edgeLabel', fontStrokeWidth : 2, fontStrokeColor : '#00ff00'}, | |
|     {from: 1, to: 3, label: 'edgeLabel'}, | |
|     {from: 2, to: 4}, | |
|     {from: 2, to: 5} | |
|   ]; | |
| 
 | |
|   // create a network | |
|   var container = document.getElementById('mynetwork'); | |
|   var data = { | |
|     nodes: nodes, | |
|     edges: edges | |
|   }; | |
|   var options = { | |
|     nodes : { | |
|       shape           : 'dot', | |
|       fontStrokeWidth : 1, | |
|       fontStrokeColor : '#d1d1d1' | |
|     }, | |
|     edges : { | |
|       fontStrokeWidth : 1, | |
|       fontStrokeColor : '#d1d1d1', | |
|       fontFill        : 'none' | |
|     } | |
|   }; | |
|   var network = new vis.Network(container, data, options); | |
| </script> | |
| 
 | |
| </body> | |
| </html>
 |