Browse Source

Merge branch 'develop' into mbroad/unittest/lib/shared

# Conflicts:
#	test/canvas-mock.js
mbroad/unittest/lib/shared
MacLeod Broad 7 years ago
parent
commit
388edb50a4
No known key found for this signature in database GPG Key ID: F1B295D13C3CC9CF
43 changed files with 437 additions and 1012 deletions
  1. +3
    -0
      .gitignore
  2. +1
    -0
      .travis.yml
  3. +9
    -0
      docs/css/style.css
  4. +2
    -16
      docs/data/dataset.html
  5. +5
    -61
      docs/data/dataview.html
  6. +5
    -61
      docs/data/index.html
  7. +5
    -66
      docs/graph2d/index.html
  8. +5
    -61
      docs/graph3d/index.html
  9. +5
    -66
      docs/network/configure.html
  10. +43
    -66
      docs/network/edges.html
  11. +5
    -66
      docs/network/groups.html
  12. +4
    -109
      docs/network/index.html
  13. +5
    -61
      docs/network/interaction.html
  14. +5
    -64
      docs/network/layout.html
  15. +5
    -61
      docs/network/manipulation.html
  16. +5
    -66
      docs/network/nodes.html
  17. +5
    -61
      docs/network/physics.html
  18. +26
    -4
      docs/publish.js
  19. +6
    -48
      docs/timeline/index.html
  20. +15
    -0
      docs/tmpl/html-foot.tmpl
  21. +1
    -2
      docs/tmpl/navbar.tmpl
  22. +18
    -0
      docs/tmpl/renderMethod.tmpl
  23. +67
    -0
      examples/network/edgeStyles/background.html
  24. +9
    -0
      lib/network/Network.js
  25. +6
    -0
      lib/network/modules/EdgesHandler.js
  26. +6
    -1
      lib/network/modules/components/Edge.js
  27. +2
    -0
      lib/network/modules/components/edges/util/BezierEdgeBase.js
  28. +56
    -0
      lib/network/modules/components/edges/util/EdgeBase.js
  29. +5
    -1
      lib/network/modules/components/shared/LabelSplitter.js
  30. +7
    -0
      lib/network/options.js
  31. +3
    -2
      misc/RELEASE_CHECKLIST_TEMPLATE.md
  32. +2
    -3
      package.json
  33. +3
    -5
      test/Activator.test.js
  34. +1
    -5
      test/ColorPicker.test.js
  35. +1
    -5
      test/Configurator.test.js
  36. +6
    -12
      test/Graph3d.test.js
  37. +1
    -6
      test/Label.test.js
  38. +2
    -18
      test/Network.test.js
  39. +9
    -2
      test/PointItem.test.js
  40. +1
    -5
      test/Popup.test.js
  41. +9
    -3
      test/TimeStep.test.js
  42. +9
    -3
      test/TimelineRange.test.js
  43. +49
    -2
      test/canvas-mock.js

+ 3
- 0
.gitignore View File

@ -17,3 +17,6 @@ npm-debug.log
.*.sw[op] .*.sw[op]
.commits.tmp .commits.tmp
gen/ gen/
.nyc_output/
coverage/
package-lock.json

+ 1
- 0
.travis.yml View File

@ -1,6 +1,7 @@
language: node_js language: node_js
node_js: node_js:
- "6" - "6"
- "7"
env: env:
- CXX=g++-4.8 - CXX=g++-4.8
addons: addons:

+ 9
- 0
docs/css/style.css View File

@ -191,6 +191,15 @@ td.indent2 {
padding-left:50px !important; padding-left:50px !important;
} }
td p:first-child {
margin-top: 0;
}
td p:last-child {
margin-bottom: 0;
}
pre.options { pre.options {
max-width:600px; max-width:600px;
} }

+ 2
- 16
docs/data/dataset.html View File

@ -5,7 +5,7 @@
<?js= self.partial('tmpl/html-head.tmpl', title) ?> <?js= self.partial('tmpl/html-head.tmpl', title) ?>
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<?js= self.partial('tmpl/navbar.tmpl', title) ?>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>DataSet</h1> <h1>DataSet</h1>
@ -933,18 +933,4 @@ var positiveBalance = dataset.get({
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 5
- 61
docs/data/dataview.html View File

@ -1,3 +1,6 @@
<?js
var self = this;
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"><head> <html lang="en"><head>
<meta charset="utf-8"> <meta charset="utf-8">
@ -35,52 +38,7 @@
<script type="text/javascript" src="../js/toggleTable.js"></script> <script type="text/javascript" src="../js/toggleTable.js"></script>
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<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><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>
<form class="navbar-form navbar-right" role="search">
<input name="q" id="tipue_search_input" autocomplete="off" type="text" class="form-control" placeholder="Enter keywords">
<button type="submit" class="btn btn-default">Go!</button>
</form>
<div id="search-results-wrapper" class="panel panel-default">
<div class="panel-body">
<div id="tipue_search_content"></div>
</div>
</div>
<div id="keyword-info" class="panel panel-success">
<div class="panel-body">
Found <span id="keyword-count"></span> results. Click <a id="keyword-jumper-button" href="">here</a> to jump to the first keyword occurence!
</div>
</div>
</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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>DataView</h1> <h1>DataView</h1>
@ -396,18 +354,4 @@ view.on('*', function (event, properties, senderId) {
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 5
- 61
docs/data/index.html View File

@ -1,3 +1,6 @@
<?js
var self = this;
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"><head> <html lang="en"><head>
<meta charset="utf-8"> <meta charset="utf-8">
@ -35,52 +38,7 @@
<script type="text/javascript" src="../js/toggleTable.js"></script> <script type="text/javascript" src="../js/toggleTable.js"></script>
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<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><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>
<form class="navbar-form navbar-right" role="search">
<input name="q" id="tipue_search_input" autocomplete="off" type="text" class="form-control" placeholder="Enter keywords">
<button type="submit" class="btn btn-default">Go!</button>
</form>
<div id="search-results-wrapper" class="panel panel-default">
<div class="panel-body">
<div id="tipue_search_content"></div>
</div>
</div>
<div id="keyword-info" class="panel panel-success">
<div class="panel-body">
Found <span id="keyword-count"></span> results. Click <a id="keyword-jumper-button" href="">here</a> to jump to the first keyword occurence!
</div>
</div>
</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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>Data</h1> <h1>Data</h1>
@ -121,18 +79,4 @@
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 5
- 66
docs/graph2d/index.html View File

@ -1,3 +1,6 @@
<?js
var self = this;
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
@ -78,57 +81,7 @@
<script type="text/javascript" src="../js/toggleTable.js"></script> <script type="text/javascript" src="../js/toggleTable.js"></script>
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<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><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>
<form class="navbar-form navbar-right" role="search">
<input name="q" id="tipue_search_input" autocomplete="off" type="text" class="form-control" placeholder="Enter keywords">
<button type="submit" class="btn btn-default">Go!</button>
</form>
<div id="search-results-wrapper" class="panel panel-default">
<div class="panel-body">
<div id="tipue_search_content"></div>
</div>
</div>
<div id="keyword-info" class="panel panel-success">
<div class="panel-body">
Found <span id="keyword-count"></span> results. Click <a id="keyword-jumper-button" href="">here</a> to jump to the first keyword occurence!
</div>
</div>
</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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>Graph2d</h1> <h1>Graph2d</h1>
@ -1500,18 +1453,4 @@ var options = {
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 5
- 61
docs/graph3d/index.html View File

@ -1,3 +1,6 @@
<?js
var self = this;
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"><head> <html lang="en"><head>
<meta charset="utf-8"> <meta charset="utf-8">
@ -35,52 +38,7 @@
<script type="text/javascript" src="../js/toggleTable.js"></script> <script type="text/javascript" src="../js/toggleTable.js"></script>
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<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><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>
<form class="navbar-form navbar-right" role="search">
<input name="q" id="tipue_search_input" autocomplete="off" type="text" class="form-control" placeholder="Enter keywords">
<button type="submit" class="btn btn-default">Go!</button>
</form>
<div id="search-results-wrapper" class="panel panel-default">
<div class="panel-body">
<div id="tipue_search_content"></div>
</div>
</div>
<div id="keyword-info" class="panel panel-success">
<div class="panel-body">
Found <span id="keyword-count"></span> results. Click <a id="keyword-jumper-button" href="">here</a> to jump to the first keyword occurence!
</div>
</div>
</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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>Graph3d</h1> <h1>Graph3d</h1>
@ -961,18 +919,4 @@ graph3d.on('cameraPositionChange', onCameraPositionChange);
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 5
- 66
docs/network/configure.html View File

@ -1,3 +1,6 @@
<?js
var self = this;
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
@ -41,57 +44,7 @@
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<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><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>
<form class="navbar-form navbar-right" role="search">
<input name="q" id="tipue_search_input" autocomplete="off" type="text" class="form-control" placeholder="Enter keywords">
<button type="button" class="btn btn-default" onclick="vis.initSiteSearch(true);">Go!</button>
</form>
<div id="search-results-wrapper" class="panel panel-default">
<div class="panel-body">
<div id="tipue_search_content"></div>
</div>
</div>
<div id="keyword-info" class="panel panel-success">
<div class="panel-body">
Found <span id="keyword-count"></span> results. Click <a id="keyword-jumper-button" href="">here</a> to jump to the first keyword occurence!
</div>
</div>
</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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>Network - configure</h1> <h1>Network - configure</h1>
@ -176,18 +129,4 @@ function (option, path) {
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 43
- 66
docs/network/edges.html View File

@ -1,3 +1,6 @@
<?js
var self = this;
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
@ -41,57 +44,7 @@
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<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><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>
<form class="navbar-form navbar-right" role="search">
<input name="q" id="tipue_search_input" autocomplete="off" type="text" class="form-control" placeholder="Enter keywords">
<button type="button" class="btn btn-default" onclick="vis.initSiteSearch(true);">Go!</button>
</form>
<div id="search-results-wrapper" class="panel panel-default">
<div class="panel-body">
<div id="tipue_search_content"></div>
</div>
</div>
<div id="keyword-info" class="panel panel-success">
<div class="panel-body">
Found <span id="keyword-count"></span> results. Click <a id="keyword-jumper-button" href="">here</a> to jump to the first keyword occurence!
</div>
</div>
</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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>Network - edges</h1> <h1>Network - edges</h1>
@ -299,6 +252,44 @@ network.setOptions(options);
<td><code>true</code></td> <td><code>true</code></td>
<td>When false, the edge stops at the arrow. This can be useful if you have thick lines and you want the arrow to end in a point. Middle arrows are not affected by this.</td> <td>When false, the edge stops at the arrow. This can be useful if you have thick lines and you want the arrow to end in a point. Middle arrows are not affected by this.</td>
</tr> </tr>
<tr class='toggle collapsible' onclick="toggleTable('optionTable','background', this);">
<td><span parent="background" class="right-caret"></span> background</td>
<td>Object or Boolean</td>
<td><code>Object</code></td>
<td>When true, a background will be under the edge using the default settings. This can be further defined by supplying
an object.
</td>
</tr>
<tr parent="background" class="hidden">
<td class="indent">background.enabled</td>
<td>Boolean</td>
<td><code>false</code></td>
<td>Toggle the display of backgrounds. If this option is not defined, it is set to true if any of the properties
in this object are defined.
</td>
</tr>
<tr parent="background" class="hidden">
<td class="indent">background.color</td>
<td>String</td>
<td><code>'rgba(111,111,111,0.5)'</code></td>
<td>The color size of the background as a string. Supported formats are 'rgb(255,255,255)', 'rgba(255,255,255,1)' and '#FFFFFF'.</td>
</tr>
<tr parent="background" class="hidden">
<td class="indent">background.size</td>
<td>Number</td>
<td><code>10</code></td>
<td>The blur size of the background.</td>
</tr>
<tr parent="background" class="hidden">
<td class="indent">background.dashes</td>
<td>Array or Boolean</td>
<td><code>false</code></td>
<td>When true, the background will be drawn as a dashed line. You can customize the dashes by supplying an Array.
Array formart: Array of numbers, gap length, dash length, gap length, dash length, ... etc. The array is
repeated until the distance is filled.
<i>When using dashed lines in IE versions older than 11, the line will be drawn straight, not smooth</i>.
</td>
</tr>
<tr class='toggle collapsible' onclick="toggleTable('optionTable','chosen', this);"> <tr class='toggle collapsible' onclick="toggleTable('optionTable','chosen', this);">
<td><span parent="chosen" class="right-caret"></span> chosen</td> <td><span parent="chosen" class="right-caret"></span> chosen</td>
<td>Object or Boolean</td> <td>Object or Boolean</td>
@ -999,18 +990,4 @@ var options: {
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 5
- 66
docs/network/groups.html View File

@ -1,3 +1,6 @@
<?js
var self = this;
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
@ -39,57 +42,7 @@
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<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><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>
<form class="navbar-form navbar-right" role="search">
<input name="q" id="tipue_search_input" autocomplete="off" type="text" class="form-control" placeholder="Enter keywords">
<button type="button" class="btn btn-default" onclick="vis.initSiteSearch(true);">Go!</button>
</form>
<div id="search-results-wrapper" class="panel panel-default">
<div class="panel-body">
<div id="tipue_search_content"></div>
</div>
</div>
<div id="keyword-info" class="panel panel-success">
<div class="panel-body">
Found <span id="keyword-count"></span> results. Click <a id="keyword-jumper-button" href="">here</a> to jump to the first keyword occurence!
</div>
</div>
</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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>Network - groups</h1> <h1>Network - groups</h1>
@ -160,18 +113,4 @@ var options = {
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 4
- 109
docs/network/index.html View File

@ -73,57 +73,7 @@
<script type="text/javascript" src="../js/toggleTable.js"></script> <script type="text/javascript" src="../js/toggleTable.js"></script>
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<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><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>
<form class="navbar-form navbar-right" role="search">
<input name="q" id="tipue_search_input" autocomplete="off" type="text" class="form-control" placeholder="Enter keywords">
<button type="button" class="btn btn-default" onclick="vis.initSiteSearch(true);">Go!</button>
</form>
<div id="search-results-wrapper" class="panel panel-default">
<div class="panel-body">
<div id="tipue_search_content"></div>
</div>
</div>
<div id="keyword-info" class="panel panel-success">
<div class="panel-body">
Found <span id="keyword-count"></span> results. Click <a id="keyword-jumper-button" href="">here</a> to jump to the first keyword occurence!
</div>
</div>
</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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>Network</h1> <h1>Network</h1>
@ -602,51 +552,10 @@ var locales = {
The options object is described for <code>clusterByConnection</code> and does the same here. The options object is described for <code>clusterByConnection</code> and does the same here.
</td> </td>
</tr> </tr>
<tr class="collapsible toggle" onclick="toggleTable('methodTable','clusterOutliers', this);">
<td colspan="2"><span parent="clusterOutliers" class="right-caret" id="method_clusterOutliers"></span> clusterOutliers(
<code>[Object options]</code>)
</tr>
<tr class="hidden" parent="clusterOutliers">
<td class="midMethods">Returns: none</td>
<td>This method will cluster all nodes with 1 edge with their respective connected node.
The options object is explained in full <a data-scroll="" data-options="{ &quot;easing&quot;: &quot;easeInCubic&quot; }" href="#optionsObject">below</a>.
</td>
</tr>
<?js
var comment = self.getComment("Network#findNode");
?>
<tr class="collapsible toggle" onclick="toggleTable('methodTable','findNodeNew', this);">
<td colspan="2"><span parent="findNode" class="right-caret" id="method_findNodeNew"></span>
<?js= comment.prototype ?> <b>This comes from the source!</b>
</tr>
<tr class="hidden" parent="findNodeNew">
<td class="midMethods">Returns: <?js= comment.returns ?></td>
<td>
<?js= comment.description ?>
</td>
</tr>
<?js= self.partial('tmpl/renderMethod.tmpl', "Network#clusterOutliers") ?>
<?js= self.partial('tmpl/renderMethod.tmpl', "Network#findNode") ?>
<tr class="collapsible toggle" onclick="toggleTable('methodTable','findNode', this);">
<td colspan="2"><span parent="findNode" class="right-caret" id="method_findNode"></span> findNode(
<code>String/Number nodeId</code>)
</tr>
<tr class="hidden" parent="findNode">
<td class="midMethods">Returns: Array</td>
<td>Nodes can be in clusters. Clusters can also be in clusters. This function returns and array of
nodeIds showing where the node is.
<br><br>
If any nodeId in the chain, especially the first passed in as a parameter, is not present in
the current nodes list, an empty array is returned.
<br><br> Example:
cluster 'A' contains cluster 'B',
cluster 'B' contains cluster 'C',
cluster 'C' contains node 'fred'.
<code>network.clustering.findNode('fred')</code> will return <code>['A','B','C','fred']</code>.
</td>
</tr>
<tr class="collapsible toggle" onclick="toggleTable('methodTable','getClusteredEdges', this);"> <tr class="collapsible toggle" onclick="toggleTable('methodTable','getClusteredEdges', this);">
<td colspan="2"><span parent="getClusteredEdges" class="right-caret" id="method_getClusteredEdges"></span> getClusteredEdges( <td colspan="2"><span parent="getClusteredEdges" class="right-caret" id="method_getClusteredEdges"></span> getClusteredEdges(
<code>String baseEdgeId</code>) <code>String baseEdgeId</code>)
@ -1696,18 +1605,4 @@ var network = new vis.Network(container, data, options);
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 5
- 61
docs/network/interaction.html View File

@ -1,3 +1,6 @@
<?js
var self = this;
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"><head> <html lang="en"><head>
@ -34,52 +37,7 @@
<script type="text/javascript" src="../js/toggleTable.js"></script> <script type="text/javascript" src="../js/toggleTable.js"></script>
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<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><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>
<form class="navbar-form navbar-right" role="search">
<input name="q" id="tipue_search_input" autocomplete="off" type="text" class="form-control" placeholder="Enter keywords">
<button type="button" class="btn btn-default" onclick="vis.initSiteSearch(true);">Go!</button>
</form>
<div id="search-results-wrapper" class="panel panel-default">
<div class="panel-body">
<div id="tipue_search_content"></div>
</div>
</div>
<div id="keyword-info" class="panel panel-success">
<div class="panel-body">
Found <span id="keyword-count"></span> results. Click <a id="keyword-jumper-button" href="">here</a> to jump to the first keyword occurence!
</div>
</div>
</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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>Network - interaction</h1> <h1>Network - interaction</h1>
<p>Used for all user interaction with the network. Handles mouse and touch events as well as the navigation buttons and the popups.</p> <p>Used for all user interaction with the network. Handles mouse and touch events as well as the navigation buttons and the popups.</p>
@ -155,18 +113,4 @@ network.setOptions(options);
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 5
- 64
docs/network/layout.html View File

@ -1,3 +1,6 @@
<?js
var self = this;
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"><head><script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-61231638-1', 'auto');ga('send', 'pageview');</script><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <html lang="en"><head><script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-61231638-1', 'auto');ga('send', 'pageview');</script><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8"> <meta charset="utf-8">
@ -35,55 +38,7 @@
<script type="text/javascript" src="../js/toggleTable.js"></script> <script type="text/javascript" src="../js/toggleTable.js"></script>
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<!-- 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><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>
<form class="navbar-form navbar-right" role="search">
<input name="q" id="tipue_search_input" autocomplete="off" type="text" class="form-control" placeholder="Enter keywords">
<button type="button" class="btn btn-default" onclick="vis.initSiteSearch(true);">Go!</button>
</form>
<div id="search-results-wrapper" class="panel panel-default">
<div class="panel-body">
<div id="tipue_search_content"></div>
</div>
</div>
<div id="keyword-info" class="panel panel-success">
<div class="panel-body">
Found <span id="keyword-count"></span> results. Click <a id="keyword-jumper-button" href="">here</a> to jump to the first keyword occurence!
</div>
</div>
</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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>Network - layout</h1> <h1>Network - layout</h1>
<p>Acts as the camera that looks on the canvas. Does the animation, zooming and focusing.</p> <p>Acts as the camera that looks on the canvas. Does the animation, zooming and focusing.</p>
@ -152,18 +107,4 @@ network.setOptions(options);
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 5
- 61
docs/network/manipulation.html View File

@ -1,3 +1,6 @@
<?js
var self = this;
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"><head> <html lang="en"><head>
<meta charset="utf-8"> <meta charset="utf-8">
@ -34,52 +37,7 @@
<script type="text/javascript" src="../js/toggleTable.js"></script> <script type="text/javascript" src="../js/toggleTable.js"></script>
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<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><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>
<form class="navbar-form navbar-right" role="search">
<input name="q" id="tipue_search_input" autocomplete="off" type="text" class="form-control" placeholder="Enter keywords">
<button type="button" class="btn btn-default" onclick="vis.initSiteSearch(true);">Go!</button>
</form>
<div id="search-results-wrapper" class="panel panel-default">
<div class="panel-body">
<div id="tipue_search_content"></div>
</div>
</div>
<div id="keyword-info" class="panel panel-success">
<div class="panel-body">
Found <span id="keyword-count"></span> results. Click <a id="keyword-jumper-button" href="">here</a> to jump to the first keyword occurence!
</div>
</div>
</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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>Network - manipulation</h1> <h1>Network - manipulation</h1>
<p>Acts as the camera that looks on the canvas. Does the animation, zooming and focusing.</p> <p>Acts as the camera that looks on the canvas. Does the animation, zooming and focusing.</p>
@ -187,18 +145,4 @@ var options = {
</table> </table>
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 5
- 66
docs/network/nodes.html View File

@ -1,3 +1,6 @@
<?js
var self = this;
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
@ -35,57 +38,7 @@
<script type="text/javascript" src="../js/toggleTable.js"></script> <script type="text/javascript" src="../js/toggleTable.js"></script>
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<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><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>
<form class="navbar-form navbar-right" role="search">
<input name="q" id="tipue_search_input" autocomplete="off" type="text" class="form-control" placeholder="Enter keywords">
<button type="button" class="btn btn-default" onclick="vis.initSiteSearch(true);">Go!</button>
</form>
<div id="search-results-wrapper" class="panel panel-default">
<div class="panel-body">
<div id="tipue_search_content"></div>
</div>
</div>
<div id="keyword-info" class="panel panel-success">
<div class="panel-body">
Found <span id="keyword-count"></span> results. Click <a id="keyword-jumper-button" href="">here</a> to jump to the first keyword occurence!
</div>
</div>
</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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>Network - nodes</h1> <h1>Network - nodes</h1>
@ -1091,18 +1044,4 @@ mySize = minSize + diff * scale;
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 5
- 61
docs/network/physics.html View File

@ -1,3 +1,6 @@
<?js
var self = this;
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"><head> <html lang="en"><head>
<meta charset="utf-8"> <meta charset="utf-8">
@ -35,52 +38,7 @@
<script type="text/javascript" src="../js/toggleTable.js"></script> <script type="text/javascript" src="../js/toggleTable.js"></script>
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<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><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>
<form class="navbar-form navbar-right" role="search">
<input name="q" id="tipue_search_input" autocomplete="off" type="text" class="form-control" placeholder="Enter keywords">
<button type="button" class="btn btn-default" onclick="vis.initSiteSearch(true);">Go!</button>
</form>
<div id="search-results-wrapper" class="panel panel-default">
<div class="panel-body">
<div id="tipue_search_content"></div>
</div>
</div>
<div id="keyword-info" class="panel panel-success">
<div class="panel-body">
Found <span id="keyword-count"></span> results. Click <a id="keyword-jumper-button" href="">here</a> to jump to the first keyword occurence!
</div>
</div>
</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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>Network - physics</h1> <h1>Network - physics</h1>
<p>Handles the physics simulation, moving the nodes and edges to show them clearly.</p> <p>Handles the physics simulation, moving the nodes and edges to show them clearly.</p>
@ -207,18 +165,4 @@ network.setOptions(options);
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 26
- 4
docs/publish.js View File

@ -54,15 +54,37 @@ function createRenderer(fromDir, data) {
*/ */
renderer.getComment = function(methodName) { renderer.getComment = function(methodName) {
var tmp = data().filter({longname: methodName}).get()[0]; var tmp = data().filter({longname: methodName}).get()[0];
//console.log(JSON.stringify(tmp));
if (tmp === undefined) {
throw new Error('Could not find jsdoc for: ' + methodName);
}
// NOTE: Following does not show up with `gulp docs`, need to do call directly
// console.log(JSON.stringify(tmp, null, 2));
// Some restructuring, to adapt it to the docs layout // Some restructuring, to adapt it to the docs layout
// This needs some work to make it handle 0 and > 1 parameters // This needs some work to make it handle 0 and > 1 parameters
var param = tmp.params[0];
var prototype = tmp.name + '(<code>' + param.type.names.join('|') + ' ' + param.name + '</code>)';
var returns = tmp.returns[0].type.names;
var paramText = "";
if (tmp.params !== undefined && tmp.params.length > 0) {
let param = tmp.params[0];
let tmpText = param.type.names.join('|') + ' ' + param.name;
if (param.optional === true) {
tmpText = '[' + tmpText + ']';
}
paramText = '<code>' + tmpText + '</code>';
}
var prototype = tmp.name + '(' + paramText + ')';
var returns = 'none';
if (tmp.returns !== undefined && tmp.returns.length > 0) {
let name = tmp.returns[0].type.names[0];
if (name !== "undefined") {
returns = name;
}
}
return { return {
name: tmp.name,
prototype: prototype, prototype: prototype,
returns: returns, returns: returns,
description: tmp.description description: tmp.description

+ 6
- 48
docs/timeline/index.html View File

@ -1,3 +1,6 @@
<?js
var self = this;
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"><head> <html lang="en"><head>
<meta charset="utf-8"> <meta charset="utf-8">
@ -41,39 +44,7 @@
<script type="text/javascript" src="../js/toggleTable.js"></script> <script type="text/javascript" src="../js/toggleTable.js"></script>
</head> </head>
<body onload="prettyPrint();"> <body onload="prettyPrint();">
<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><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>
<?js= self.partial('tmpl/navbar.tmpl') ?>
<div class="container full"> <div class="container full">
<h1>Timeline</h1> <h1>Timeline</h1>
@ -1597,6 +1568,7 @@ timeline.off('select', onSelect);
<tr> <tr>
<td>currentTimeTick</td> <td>currentTimeTick</td>
<td>Has no properties</td>
<td>Fired when the current time bar redraws. The rate depends on the zoom level.</td> <td>Fired when the current time bar redraws. The rate depends on the zoom level.</td>
</tr> </tr>
@ -2166,18 +2138,4 @@ var options = {
</ul> </ul>
</div> </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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>
<?js= self.partial('tmpl/html-foot.tmpl') ?>

+ 15
- 0
docs/tmpl/html-foot.tmpl View File

@ -0,0 +1,15 @@
<!-- 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>
<!-- jquery extensions -->
<script src="../js/jquery.highlight.js"></script>
<script src="../js/jquery.url.min.js"></script>
<!-- Tipue vendor js -->
<script src="../js/tipuesearch.config.js"></script>
<script src="../js/tipuesearch.js"></script>
<!-- controller -->
<script src="../js/main.js"></script>

+ 1
- 2
docs/tmpl/navbar.tmpl View File

@ -1,5 +1,4 @@
<?js <?js
var title = obj;
var self = this; var self = this;
?> ?>
<div class="navbar-wrapper"> <div class="navbar-wrapper">
@ -46,4 +45,4 @@
</div> </div>
</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>
<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>

+ 18
- 0
docs/tmpl/renderMethod.tmpl View File

@ -0,0 +1,18 @@
<?js
//
// Output the HTML for showing a method description in a method table.
//
var methodName = obj;
var self = this;
var comment = self.getComment(methodName);
?>
<tr class="collapsible toggle" onclick="toggleTable('methodTable','<?js= comment.name ?>', this);">
<td colspan="2"><span parent="<?js= comment.name ?>" class="right-caret" id="method_<?js= comment.name ?>"></span>
<?js= comment.prototype ?>
</tr>
<tr class="hidden" parent="<?js= comment.name ?>">
<td class="midMethods">Returns: <?js= comment.returns ?></td>
<td>
<?js= comment.description ?>
</td>
</tr>

+ 67
- 0
examples/network/edgeStyles/background.html View File

@ -0,0 +1,67 @@
<!doctype html>
<html>
<head>
<title>Network | Edge background</title>
<script type="text/javascript" src="../../../dist/vis.js"></script>
<link href="../../../dist/vis-network.min.css" rel="stylesheet" type="text/css" />
<style type="text/css">
#mynetwork {
width: 600px;
height: 400px;
border: 1px solid lightgray;
}
</style>
</head>
<body>
<p>
Edge background.
</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'}
]);
// create an array with edges
var edges = new vis.DataSet([
{from: 1, to: 3, dashes:true},
{from: 1, to: 2, dashes:[5,5]},
{from: 2, to: 4, dashes:[5,5,3,3], background: false},
{from: 2, to: 5, dashes:[2,2,10,10]},
{from: 2, to: 6, dashes:false, background:{ enabled: true, color: 'rgba(111,111,111,0.5)', size:10, dashes: [20,10] }},
]);
// create a network
var container = document.getElementById('mynetwork');
var data = {
nodes: nodes,
edges: edges
};
var options = {
edges:{
shadow: true,
smooth: true,
background:{
enabled: true,
color: '#ff0000'
}
}
}
var network = new vis.Network(container, data, options);
</script>
</body>
</html>

+ 9
- 0
lib/network/Network.js View File

@ -497,7 +497,16 @@ Network.prototype.cluster = function() {return this.clustering.clust
Network.prototype.getNodesInCluster = function() {return this.clustering.getNodesInCluster.apply(this.clustering,arguments);}; Network.prototype.getNodesInCluster = function() {return this.clustering.getNodesInCluster.apply(this.clustering,arguments);};
Network.prototype.clusterByConnection = function() {return this.clustering.clusterByConnection.apply(this.clustering,arguments);}; Network.prototype.clusterByConnection = function() {return this.clustering.clusterByConnection.apply(this.clustering,arguments);};
Network.prototype.clusterByHubsize = function() {return this.clustering.clusterByHubsize.apply(this.clustering,arguments);}; Network.prototype.clusterByHubsize = function() {return this.clustering.clusterByHubsize.apply(this.clustering,arguments);};
/**
* This method will cluster all nodes with 1 edge with their respective connected node.
* The options object is explained in full <a data-scroll="" data-options="{ &quot;easing&quot;: &quot;easeInCubic&quot; }" href="#optionsObject">below</a>.
*
* @param {object} [options]
* @returns {undefined}
*/
Network.prototype.clusterOutliers = function() {return this.clustering.clusterOutliers.apply(this.clustering,arguments);}; Network.prototype.clusterOutliers = function() {return this.clustering.clusterOutliers.apply(this.clustering,arguments);};
Network.prototype.getSeed = function() {return this.layoutEngine.getSeed.apply(this.layoutEngine,arguments);}; Network.prototype.getSeed = function() {return this.layoutEngine.getSeed.apply(this.layoutEngine,arguments);};
Network.prototype.enableEditMode = function() {return this.manipulation.enableEditMode.apply(this.manipulation,arguments);}; Network.prototype.enableEditMode = function() {return this.manipulation.enableEditMode.apply(this.manipulation,arguments);};
Network.prototype.disableEditMode = function() {return this.manipulation.disableEditMode.apply(this.manipulation,arguments);}; Network.prototype.disableEditMode = function() {return this.manipulation.disableEditMode.apply(this.manipulation,arguments);};

+ 6
- 0
lib/network/modules/EdgesHandler.js View File

@ -103,6 +103,12 @@ class EdgesHandler {
x:5, x:5,
y:5 y:5
}, },
background:{
enabled: false,
color: 'rgba(111,111,111,1)',
size:10,
dashes: false
},
smooth: { smooth: {
enabled: true, enabled: true,
type: "dynamic", type: "dynamic",

+ 6
- 1
lib/network/modules/components/Edge.js View File

@ -147,6 +147,7 @@ class Edge {
util.mergeOptions(parentOptions, newOptions, 'smooth', globalOptions); util.mergeOptions(parentOptions, newOptions, 'smooth', globalOptions);
util.mergeOptions(parentOptions, newOptions, 'shadow', globalOptions); util.mergeOptions(parentOptions, newOptions, 'shadow', globalOptions);
util.mergeOptions(parentOptions, newOptions, 'background', globalOptions);
if (newOptions.dashes !== undefined && newOptions.dashes !== null) { if (newOptions.dashes !== undefined && newOptions.dashes !== null) {
parentOptions.dashes = newOptions.dashes; parentOptions.dashes = newOptions.dashes;
@ -270,7 +271,11 @@ class Edge {
shadowX: this.options.shadow.x, shadowX: this.options.shadow.x,
shadowY: this.options.shadow.y, shadowY: this.options.shadow.y,
dashes: this.options.dashes, dashes: this.options.dashes,
width: this.options.width
width: this.options.width,
background: this.options.background.enabled,
backgroundColor: this.options.background.color,
backgroundSize: this.options.background.size,
backgroundDashes: this.options.background.dashes
}; };
if (this.selected || this.hover) { if (this.selected || this.hover) {
if (this.chooser === true) { if (this.chooser === true) {

+ 2
- 0
lib/network/modules/components/edges/util/BezierEdgeBase.js View File

@ -140,6 +140,8 @@ class BezierEdgeBase extends EdgeBase {
// fallback to normal straight edge // fallback to normal straight edge
ctx.lineTo(this.toPoint.x, this.toPoint.y); ctx.lineTo(this.toPoint.x, this.toPoint.y);
} }
// draw a background
this.drawBackground(ctx, values);
// draw shadow if enabled // draw shadow if enabled
this.enableShadow(ctx, values); this.enableShadow(ctx, values);

+ 56
- 0
lib/network/modules/components/edges/util/EdgeBase.js View File

@ -592,6 +592,62 @@ class EdgeBase {
ctx.shadowOffsetY = 0; ctx.shadowOffsetY = 0;
} }
} }
/**
*
* @param {CanvasRenderingContext2D} ctx
* @param {{toArrow: boolean, toArrowScale: (allOptions.edges.arrows.to.scaleFactor|{number}|allOptions.edges.arrows.middle.scaleFactor|allOptions.edges.arrows.from.scaleFactor|Array|number), toArrowType: *, middleArrow: boolean, middleArrowScale: (number|allOptions.edges.arrows.middle.scaleFactor|{number}|Array), middleArrowType: (allOptions.edges.arrows.middle.type|{string}|string|*), fromArrow: boolean, fromArrowScale: (allOptions.edges.arrows.to.scaleFactor|{number}|allOptions.edges.arrows.middle.scaleFactor|allOptions.edges.arrows.from.scaleFactor|Array|number), fromArrowType: *, arrowStrikethrough: (*|boolean|allOptions.edges.arrowStrikethrough|{boolean}), color: undefined, inheritsColor: (string|string|string|allOptions.edges.color.inherit|{string, boolean}|Array|*), opacity: *, hidden: *, length: *, shadow: *, shadowColor: *, shadowSize: *, shadowX: *, shadowY: *, dashes: (*|boolean|Array|allOptions.edges.dashes|{boolean, array}), width: *}} values
*/
drawBackground(ctx, values) {
if (values.background !== false) {
let attrs = ['strokeStyle', 'lineWidth', 'dashes'];
let origCtxAttr = {};
// save original line attrs
attrs.forEach(function(attrname) {
origCtxAttr[attrname] = ctx[attrname];
});
ctx.strokeStyle = values.backgroundColor;
ctx.lineWidth = values.backgroundSize;
this.setStrokeDashed(ctx, values.backgroundDashes);
ctx.stroke();
// restore original line attrs
attrs.forEach(function(attrname) {
ctx[attrname] = origCtxAttr[attrname];
});
this.setStrokeDashed(ctx, values.dashes);
}
}
/**
*
* @param {CanvasRenderingContext2D} ctx
* @param {boolean|Array} dashes
*/
setStrokeDashed(ctx, dashes) {
if (dashes !== false) {
if (ctx.setLineDash !== undefined) {
let pattern = [5, 5];
if (Array.isArray(dashes) === true) {
pattern = dashes;
}
ctx.setLineDash(pattern);
}
else {
console.warn("setLineDash is not supported in this browser. The dashed stroke cannot be used.");
}
}
else {
if (ctx.setLineDash !== undefined) {
ctx.setLineDash([]);
}
else {
console.warn("setLineDash is not supported in this browser. The dashed stroke cannot be used.");
}
}
}
} }
export default EdgeBase; export default EdgeBase;

+ 5
- 1
lib/network/modules/components/shared/LabelSplitter.js View File

@ -243,8 +243,12 @@ class MarkupAccumulator {
/** /**
* Create a regular expression for the tag if it isn't already one. * Create a regular expression for the tag if it isn't already one.
* *
* The return value is an array `[RegExp, number]`, with exactly two value, where:
* - RegExp is the regular expression to use
* - number is the lenth of the input string to match
*
* @param {string|RegExp} tag string to match in text * @param {string|RegExp} tag string to match in text
* @returns {[RegExp, number]} regular expression to use and length of input string to match
* @returns {Array} regular expression to use and length of input string to match
* @private * @private
*/ */
prepareRegExp(tag) { prepareRegExp(tag) {

+ 7
- 0
lib/network/options.js View File

@ -32,6 +32,13 @@ let allOptions = {
__type__: { string: ['from', 'to', 'middle'], object } __type__: { string: ['from', 'to', 'middle'], object }
}, },
arrowStrikethrough: { boolean: bool }, arrowStrikethrough: { boolean: bool },
background: {
enabled: { boolean: bool },
color: { string },
size: { number },
dashes: { boolean: bool, array },
__type__: { object, boolean: bool }
},
chosen: { chosen: {
label: { boolean: bool, 'function': 'function' }, label: { boolean: bool, 'function': 'function' },
edge: { boolean: bool, 'function': 'function' }, edge: { boolean: bool, 'function': 'function' },

+ 3
- 2
misc/RELEASE_CHECKLIST_TEMPLATE.md View File

@ -66,7 +66,8 @@ If we would merge the development branch would overwrite this. To solve this we
## Update website ## Update website
- [ ] update the gh-pages branch: `git checkout gh-pages && git pull && git checkout -b "gh-pages_vX.Y.Z"` - [ ] update the gh-pages branch: `git checkout gh-pages && git pull && git checkout -b "gh-pages_vX.Y.Z"`
- [ ] Copy the `dist` folder from the `master` branch to the `github-pages` branch in another directory, overwriting existing files: `cp -rf ../vis_vX.Y.Z/vis/dist .` - [ ] Copy the `dist` folder from the `master` branch to the `github-pages` branch in another directory, overwriting existing files: `cp -rf ../vis_vX.Y.Z/vis/dist .`
- [ ] Copy the `docs` folder from the `master` branch to the `github-pages` branch in another directory, overwriting existing files: `cp -rf ../vis_vX.Y.Z/vis/docs .`
- [ ] Generate the documentation: `gulp docs`
- [ ] Copy the `gen/docs` folder from the `master` branch to the `github-pages` branch in another directory, overwriting existing files: `cp -rf ../vis_vX.Y.Z/vis/gen/docs .`
- [ ] Copy the `examples` folder from the `master` branch to the `github-pages` branch in another directory, overwriting existing files: `cp -rf ../vis_vX.Y.Z/vis/examples .` - [ ] Copy the `examples` folder from the `master` branch to the `github-pages` branch in another directory, overwriting existing files: `cp -rf ../vis_vX.Y.Z/vis/examples .`
- [ ] Check if there are new or updated examples, and update the gallery screenshots accordingly. - [ ] Check if there are new or updated examples, and update the gallery screenshots accordingly.
- [ ] Update the library version number in the `index.html` page. - [ ] Update the library version number in the `index.html` page.
@ -83,4 +84,4 @@ If we would merge the development branch would overwrite this. To solve this we
- [ ] FORCE-Push the branches to github: `git push --force && git push --tag` - [ ] FORCE-Push the branches to github: `git push --force && git push --tag`
- [ ] [Re-Enable branch protection](https://github.com/almende/vis/settings/branches/develop) (enable ALL checkboxes) for `develop`. - [ ] [Re-Enable branch protection](https://github.com/almende/vis/settings/branches/develop) (enable ALL checkboxes) for `develop`.
DONE!
DONE!

+ 2
- 3
package.json View File

@ -61,11 +61,10 @@
"gulp-rename": "^1.2.2", "gulp-rename": "^1.2.2",
"gulp-util": "^3.0.8", "gulp-util": "^3.0.8",
"jsdoc": "^3.5.5", "jsdoc": "^3.5.5",
"jsdom": "9.12.0",
"jsdom-global": "^2.1.1",
"jsdom": "11.3.0",
"jsdom-global": "^3.0.2",
"merge-stream": "^1.0.1", "merge-stream": "^1.0.1",
"mocha": "^3.4.2", "mocha": "^3.4.2",
"mocha-jsdom": "^1.1.0",
"nyc": "^11.2.1", "nyc": "^11.2.1",
"rimraf": "^2.6.1", "rimraf": "^2.6.1",
"sinon": "^4.0.1", "sinon": "^4.0.1",

+ 3
- 5
test/Activator.test.js View File

@ -1,18 +1,16 @@
var assert = require('assert'); var assert = require('assert');
var sinon = require('sinon'); var sinon = require('sinon');
var jsdom = require('jsdom');
var jsdom_global = require('jsdom-global'); var jsdom_global = require('jsdom-global');
var canvasMockify = require('./canvas-mock'); var canvasMockify = require('./canvas-mock');
var Activator = require('../lib/shared/Activator'); var Activator = require('../lib/shared/Activator');
describe('Activator', function () { describe('Activator', function () {
beforeEach(function() { beforeEach(function() {
this.jsdom_global = jsdom_global(
"<div id='mynetwork'></div>",
{ skipWindowCheck: true}
);
canvasMockify(window);
this.jsdom_global = canvasMockify("<div id='mynetwork'></div>");
this.container = document.getElementById('mynetwork'); this.container = document.getElementById('mynetwork');
}); });

+ 1
- 5
test/ColorPicker.test.js View File

@ -7,11 +7,7 @@ var ColorPicker = require('../lib/shared/ColorPicker').default;
describe('ColorPicker', function () { describe('ColorPicker', function () {
beforeEach(function() { beforeEach(function() {
this.jsdom_global = jsdom_global(
"<div id='mynetwork'></div>",
{ skipWindowCheck: true}
);
canvasMockify(window);
this.jsdom_global = canvasMockify("<div id='mynetwork'></div>");
this.container = document.getElementById('mynetwork'); this.container = document.getElementById('mynetwork');
}); });

+ 1
- 5
test/Configurator.test.js View File

@ -8,11 +8,7 @@ var {allOptions, configureOptions} = require('../lib/network/options.js');
describe('Configurator', function () { describe('Configurator', function () {
beforeEach(function() { beforeEach(function() {
this.jsdom_global = jsdom_global(
"<div id='mynetwork'></div><div id='other'></div>",
{ skipWindowCheck: true}
);
canvasMockify(window);
this.jsdom_global = canvasMockify("<div id='mynetwork'></div><div id='other'></div>");
this.container = document.getElementById('mynetwork'); this.container = document.getElementById('mynetwork');
}); });

+ 6
- 12
test/Graph3d.test.js View File

@ -11,16 +11,16 @@ var now = new Date();
describe('Graph3d', function () { describe('Graph3d', function () {
before(function() { before(function() {
//console.log('before!');
this.jsdom_global = jsdom_global(
"<div id='mygraph'></div>",
{ skipWindowCheck: true}
);
canvasMockify(window);
this.jsdom_global = canvasMockify("<div id='mygraph'></div>");
this.container = document.getElementById('mygraph'); this.container = document.getElementById('mygraph');
}); });
after(function() {
this.jsdom_global();
});
it('should pass validation for the default options', function () { it('should pass validation for the default options', function () {
assert(Graph3d.DEFAULTS !== undefined); assert(Graph3d.DEFAULTS !== undefined);
@ -61,10 +61,4 @@ describe('Graph3d', function () {
graph.setOptions({ style: 'bar'}); // Call should just work, no exception thrown graph.setOptions({ style: 'bar'}); // Call should just work, no exception thrown
assert.equal(graph.style, BAR_STYLE, "Style not set to expected 'bar'"); assert.equal(graph.style, BAR_STYLE, "Style not set to expected 'bar'");
}); });
after(function() {
//console.log('after!');
this.jsdom_global();
});
}); });

+ 1
- 6
test/Label.test.js View File

@ -13,7 +13,6 @@ var assert = require('assert');
var Label = require('../lib/network/modules/components/shared/Label').default; var Label = require('../lib/network/modules/components/shared/Label').default;
var NodesHandler = require('../lib/network/modules/NodesHandler').default; var NodesHandler = require('../lib/network/modules/NodesHandler').default;
var util = require('../lib/util'); var util = require('../lib/util');
var jsdom_global = require('jsdom-global');
var canvasMockify = require('./canvas-mock'); var canvasMockify = require('./canvas-mock');
var DataSet = require('../lib/DataSet'); var DataSet = require('../lib/DataSet');
var Network = require('../lib/network/Network'); var Network = require('../lib/network/Network');
@ -322,11 +321,7 @@ describe('Network Label', function() {
**************************************************************/ **************************************************************/
before(function() { before(function() {
this.jsdom_global = jsdom_global(
"<div id='mynetwork'></div>",
{ skipWindowCheck: true}
);
canvasMockify(window);
this.jsdom_global = canvasMockify("<div id='mynetwork'></div>");
this.container = document.getElementById('mynetwork'); this.container = document.getElementById('mynetwork');
}); });

+ 2
- 18
test/Network.test.js View File

@ -16,7 +16,6 @@ var DataSet = require('../lib/DataSet');
var Network = require('../lib/network/Network'); var Network = require('../lib/network/Network');
var stdout = require('test-console').stdout; var stdout = require('test-console').stdout;
var Validator = require("./../lib/shared/Validator").default; var Validator = require("./../lib/shared/Validator").default;
var jsdom_global = require('jsdom-global');
var canvasMockify = require('./canvas-mock'); var canvasMockify = require('./canvas-mock');
var {allOptions, configureOptions} = require('./../lib/network/options.js'); var {allOptions, configureOptions} = require('./../lib/network/options.js');
//var {printStyle} = require('./../lib/shared/Validator'); //var {printStyle} = require('./../lib/shared/Validator');
@ -222,31 +221,16 @@ function checkFontProperties(fontItem, checkStrict = true) {
} }
describe('Network', function () { describe('Network', function () {
before(function() { before(function() {
this.jsdom_global = jsdom_global(
"<div id='mynetwork'></div>",
{ skipWindowCheck: true}
);
canvasMockify(window);
this.jsdom_global = canvasMockify("<div id='mynetwork'></div>");
this.container = document.getElementById('mynetwork'); this.container = document.getElementById('mynetwork');
}); });
after(function() { after(function() {
try {
this.jsdom_global();
} catch(e) {
if (e.message() === 'window is undefined') {
console.warning("'" + e.message() + "' happened again");
} else {
throw e;
}
}
this.jsdom_global();
}); });

+ 9
- 2
test/PointItem.test.js View File

@ -1,5 +1,5 @@
var assert = require('assert'); var assert = require('assert');
var jsdom = require('mocha-jsdom');
var jsdom_global = require('jsdom-global');
var moment = require('../lib/module/moment'); var moment = require('../lib/module/moment');
var PointItem = require("../lib/timeline/component/item/PointItem"); var PointItem = require("../lib/timeline/component/item/PointItem");
var Range = require('../lib/timeline/Range'); var Range = require('../lib/timeline/Range');
@ -7,9 +7,16 @@ var TestSupport = require('./TestSupport');
describe('Timeline PointItem', function () { describe('Timeline PointItem', function () {
jsdom();
var now = moment(); var now = moment();
before(function() {
this.jsdom_global = jsdom_global();
});
after(function() {
this.jsdom_global();
});
it('should initialize with minimal data', function() { it('should initialize with minimal data', function() {
var pointItem = new PointItem({start: now.toDate()}, null, null); var pointItem = new PointItem({start: now.toDate()}, null, null);
assert.equal(pointItem.props.content.height, 0); assert.equal(pointItem.props.content.height, 0);

+ 1
- 5
test/Popup.test.js View File

@ -7,11 +7,7 @@ var Popup = require('../lib/shared/Popup').default;
describe('Popup', function () { describe('Popup', function () {
beforeEach(function() { beforeEach(function() {
this.jsdom_global = jsdom_global(
"<div id='mynetwork'></div>",
{ skipWindowCheck: true}
);
canvasMockify(window);
this.jsdom_global = canvasMockify("<div id='mynetwork'></div>");
this.container = document.getElementById('mynetwork'); this.container = document.getElementById('mynetwork');
}); });

+ 9
- 3
test/TimeStep.test.js View File

@ -1,12 +1,18 @@
var assert = require('assert'); var assert = require('assert');
var jsdom = require('mocha-jsdom');
var jsdom_global = require('jsdom-global');
var moment = require('../lib/module/moment'); var moment = require('../lib/module/moment');
var TimeStep = require('../lib/timeline/TimeStep'); var TimeStep = require('../lib/timeline/TimeStep');
var TestSupport = require('./TestSupport'); var TestSupport = require('./TestSupport');
describe('TimeStep', function () { describe('TimeStep', function () {
jsdom();
before(function() {
this.jsdom_global = jsdom_global();
});
after(function() {
this.jsdom_global();
});
it('should work with just start and end dates', function () { it('should work with just start and end dates', function () {
var timestep = new TimeStep(new Date(2017, 3, 3), new Date(2017, 3, 5)); var timestep = new TimeStep(new Date(2017, 3, 3), new Date(2017, 3, 5));
@ -85,4 +91,4 @@ describe('TimeStep', function () {
assert.equal(timestep.getCurrent().unix(), moment("2017-04-03T01:00:00.000").unix(), "should have the right value after a step"); assert.equal(timestep.getCurrent().unix(), moment("2017-04-03T01:00:00.000").unix(), "should have the right value after a step");
}); });
});
});

+ 9
- 3
test/TimelineRange.test.js View File

@ -1,12 +1,18 @@
var assert = require('assert'); var assert = require('assert');
var jsdom = require('mocha-jsdom');
var jsdom_global = require('jsdom-global');
var moment = require('../lib/module/moment'); var moment = require('../lib/module/moment');
var Range = require('../lib/timeline/Range'); var Range = require('../lib/timeline/Range');
var TestSupport = require('./TestSupport'); var TestSupport = require('./TestSupport');
describe('Timeline Range', function () { describe('Timeline Range', function () {
jsdom();
before(function() {
this.jsdom_global = jsdom_global();
});
after(function() {
this.jsdom_global();
});
it('should have start default before now', function () { it('should have start default before now', function () {
var now = moment().hours(0).minutes(0).seconds(0).milliseconds(0).valueOf(); var now = moment().hours(0).minutes(0).seconds(0).milliseconds(0).valueOf();
@ -37,4 +43,4 @@ describe('Timeline Range', function () {
range.setRange(new Date(2017, 0, 26, 13, 26, 3, 320), new Date(2017, 0, 26, 13, 26, 4, 320), false, false, null); range.setRange(new Date(2017, 0, 26, 13, 26, 3, 320), new Date(2017, 0, 26, 13, 26, 4, 320), false, false, null);
assert.equal(range.getMillisecondsPerPixel(), 1, "one second over 1000 pixels"); assert.equal(range.getMillisecondsPerPixel(), 1, "one second over 1000 pixels");
}); });
});
});

+ 49
- 2
test/canvas-mock.js View File

@ -3,6 +3,8 @@
* *
* Adapted from: https://github.com/Cristy94/canvas-mock * Adapted from: https://github.com/Cristy94/canvas-mock
*/ */
var jsdom = require('jsdom');
var jsdom_global = require('jsdom-global');
var canvasMock; // Use one canvas instance for all calls to createElement('canvas'); var canvasMock; // Use one canvas instance for all calls to createElement('canvas');
@ -61,10 +63,11 @@ function replaceCanvasContext (el) {
* The override is only done if there is no 2D context already present. * The override is only done if there is no 2D context already present.
* This allows for normal running in a browser, and for node.js the usage of 'canvas'. * This allows for normal running in a browser, and for node.js the usage of 'canvas'.
* *
* @param {object} window - current global window object. This can possible come from module 'jsdom',
* @param {object} window - current global window object. This can possibly come from module 'jsdom',
* when running under node.js. * when running under node.js.
* @private
*/ */
function mockify(window) {
function overrideCreateElement(window) {
var d = window.document; var d = window.document;
var f = window.document.createElement; var f = window.document.createElement;
@ -89,4 +92,48 @@ function mockify(window) {
}; };
} }
/**
* Initialize the mock, jsdom and jsdom_global for unit test usage.
*
* Suppresses a warning from `jsdom` on usage of `getContext()`. A mock definition is added for
* it, so the message is not relevant.
*
* @param {string} [html=''] html definitions which should be added to the jsdom definition
* @returns {function} function to call in after(), to clean up for `jsdom_global`
*/
function mockify(html = '') {
// Start of message that we want to suppress.
let msg = 'Error: Not implemented: HTMLCanvasElement.prototype.getContext'
+ ' (without installing the canvas npm package)';
// Override default virtual console of jsdom
const virtualConsole = new jsdom.VirtualConsole();
// Set up a simple 'mock' console output. Only 'error' needs to be overridden
let myConsole = {
error: (msg) => {
if (msg.indexOf(msg) === 0) {
//console.error('all is well');
} else {
// All other messages pass through
console.error(msg);
}
}
};
// Using the global catch instead of specific event handler, because I couldn't get them to work
virtualConsole.sendTo(myConsole);
let cleanupFunction = jsdom_global(
html,
{ skipWindowCheck: true, virtualConsole: virtualConsole}
);
overrideCreateElement(window); // The actual initialization of canvas-mock
return cleanupFunction;
}
module.exports = mockify; module.exports = mockify;

Loading…
Cancel
Save