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.

175 lines
7.3 KiB

9 years ago
9 years ago
9 years ago
9 years ago
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5. <meta charset="utf-8">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7. <meta name="viewport" content="width=device-width, initial-scale=1">
  8. <meta name="description" content="">
  9. <meta name="author" content="">
  10. <link rel="icon" HREF="favicon.ico">
  11. <title>vis.js - A dynamic, browser based visualization library.</title>
  12. <!-- Bootstrap core CSS -->
  13. <link href="../css/bootstrap.css" rel="stylesheet">
  14. <link href="../css/newdocs.css" rel="stylesheet">
  15. <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  16. <!--[if lt IE 9]>
  17. <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
  18. <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  19. <![endif]-->
  20. <link href="../css/prettify.css" type="text/css" rel="stylesheet"/>
  21. <script type="text/javascript" src="../js/googleAnalytics.js"></script>
  22. <script type="text/javascript" src="../js/toggleTable.js"></script>
  23. <script type="text/javascript" src="../js/prettify/prettify.js"></script>
  24. <script src="../js/smooth-scroll.min.js"></script>
  25. <script language="JavaScript">
  26. smoothScroll.init();
  27. </script>
  28. <style>
  29. </style>
  30. </head>
  31. <!-- NAVBAR
  32. ================================================== -->
  33. <body onload="prettyPrint();">
  34. <div class="navbar-wrapper">
  35. <div class="container">
  36. <nav class="navbar navbar-inverse navbar-static-top" role="navigation">
  37. <div class="container">
  38. <div class="navbar-header">
  39. <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar"
  40. aria-expanded="false" aria-controls="navbar">
  41. <span class="sr-only">Toggle navigation</span>
  42. <span class="icon-bar"></span>
  43. <span class="icon-bar"></span>
  44. <span class="icon-bar"></span>
  45. </button>
  46. <a class="navbar-brand hidden-sm" href="./index.html">vis.js</a>
  47. </div>
  48. <div id="navbar" class="navbar-collapse collapse">
  49. <ul class="nav navbar-nav">
  50. <li><a href="../index.html#modules">Modules</a></li>
  51. <li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon"
  52. src="../img/external-link-icons/external-link-icon-white.png"></a>
  53. </li>
  54. <li><a href="../blog.html">Blog</a></li>
  55. <li><a href="../index.html#download_install">Download</a></li>
  56. <li><a href="../showcase/index.html">Showcase</a></li>
  57. <li><a href="../index.html#contribute">Contribute</a></li>
  58. <li><a href="../featureRequests.html">Feature requests</a></li>
  59. <li><a href="../index.html#licenses">License</a></li>
  60. </ul>
  61. </div>
  62. </div>
  63. </nav>
  64. </div>
  65. </div>
  66. <a href="https://github.com/almende/vis" class="hidden-xs hidden-sm hidden-md"><img
  67. style="position: absolute; top: 0; right: 0; border: 0;"
  68. src="https://camo.githubusercontent.com/38ef81f8aca64bb9a64448d0d70f1308ef5341ab/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6461726b626c75655f3132313632312e706e67"
  69. alt="Fork me on GitHub"
  70. data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png"></a>
  71. <div class="container full">
  72. <h1>Network - configure</h1>
  73. <p>Handles the HTML part of the canvas.</p>
  74. <h3>Options</h3>
  75. <p>The options for the canvas have to be contained in an object titled 'configure'.</p>
  76. <p>Click on the full options or shorthand options to show how these options are supposed to be used.</p>
  77. <ul class="nav nav-tabs">
  78. <li role="presentation" class="active" onclick="hideOptions('fullTab','fullOptions','shortTab','shortOptions');" id="hiddenTab"><a href="#">options hidden</a></li>
  79. <li role="presentation" onclick="toggleTab('fullTab','fullOptions','shortTab','shortOptions');" id="fullTab"><a href="#">full options</a></li>
  80. <li role="presentation" onclick="toggleTab('shortTab','shortOptions','fullTab','fullOptions');" id="shortTab"><a href="#">shorthand options</a></li>
  81. </ul>
  82. <br>
  83. <pre class="prettyprint lang-js options top hidden" id="fullOptions">
  84. // these are all options in full.
  85. var options = {
  86. configure: {
  87. enabled: true,
  88. filter: 'nodes,edges',
  89. container: undefined
  90. }
  91. }
  92. network.setOptions(options);
  93. </pre>
  94. <pre class="prettyprint lang-js options top hidden" id="shortOptions">
  95. // only the options that have shorthand notations are shown.
  96. var options = {
  97. configure: 'nodes,edges'
  98. }
  99. network.setOptions(options);
  100. </pre>
  101. <p>As shown above, alternative to supplying an object, you can supply a <code>String</code>, <code>Array</code> or
  102. <code>Boolean</code>. These will do the same as the filter option described below.</p>
  103. <table class="moduleTable">
  104. <tr class="header">
  105. <td class="nameSmall">name</td>
  106. <td class="type">type</td>
  107. <td class="default">default</td>
  108. <td class="description">description</td>
  109. </tr>
  110. <tr>
  111. <td>enabled</td>
  112. <td class="mid">Boolean</td>
  113. <td class="mid"><code>true</code></td>
  114. <td>Toggle the configuration interface on or off. This is an optional parameter. If left undefined and any of the other properties of this object are defined, this will be set to true.
  115. </td>
  116. </tr>
  117. <tr>
  118. <td>filter</td>
  119. <td class="mid">String or Array or Boolean</td>
  120. <td class="mid"><code>true</code></td>
  121. <td>When a boolean, true gives you all options, false will not show any. If a string is supplied, any
  122. combination of the following is allowed: nodes, edges, layout, interaction, manipulation, physics,
  123. selection, renderer. Feel free to come up with a fun seperating character. Finally, when supplied an
  124. array of strings, any of the previously mentioned fields are accepted.
  125. </td>
  126. </tr>
  127. <tr>
  128. <td>container</td>
  129. <td class="mid">DOM element</td>
  130. <td class="mid"><code>undefined</code></td>
  131. <td>This allows you to put the configure list in another HTML container than below the network.</td>
  132. </tr>
  133. </table>
  134. <h3>Methods</h3>
  135. <p>The configure module has no methods.</p>
  136. <h3>Events</h3>
  137. <p>The configure module has no Events.</p>
  138. <br/>
  139. <br/>
  140. <br/>
  141. <br/>
  142. <br/>
  143. <br/>
  144. <br/>
  145. </div>
  146. <!-- Bootstrap core JavaScript
  147. ================================================== -->
  148. <!-- Placed at the end of the document so the pages load faster -->
  149. <script src="../js/jquery.min.js"></script>
  150. <script src="../js/bootstrap.min.js"></script>
  151. <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
  152. <script src="../js/ie10-viewport-bug-workaround.js"></script>