Alex de Mulder
9 years ago
47 changed files with 11705 additions and 381 deletions
Split View
Diff Options
-
+8 -0dist/vis.css
-
+377 -378dist/vis.js
-
+1 -1dist/vis.min.css
-
+470 -0docs/css/bootstrap-theme.css
-
+1 -0docs/css/bootstrap-theme.css.map
-
+5 -0docs/css/bootstrap-theme.min.css
-
+6332 -0docs/css/bootstrap.css
-
+1 -0docs/css/bootstrap.css.map
-
+5 -0docs/css/bootstrap.min.css
-
+142 -0docs/css/carousel.css
-
+61 -0docs/css/examples.css
-
+85 -0docs/css/newdocs.css
-
+2320 -0docs/js/bootstrap.js
-
+7 -0docs/js/bootstrap.min.js
-
+26 -0docs/js/docs.min.js
-
+51 -0docs/js/ie-emulation-modes-warning.js
-
+22 -0docs/js/ie10-viewport-bug-workaround.js
-
+4 -0docs/js/jquery.min.js
-
+2 -0docs/js/prettify/lang-apollo.js
-
+2 -0docs/js/prettify/lang-css.js
-
+2 -0docs/js/prettify/lang-hs.js
-
+2 -0docs/js/prettify/lang-lisp.js
-
+2 -0docs/js/prettify/lang-lua.js
-
+2 -0docs/js/prettify/lang-ml.js
-
+1 -0docs/js/prettify/lang-proto.js
-
+2 -0docs/js/prettify/lang-scala.js
-
+2 -0docs/js/prettify/lang-sql.js
-
+2 -0docs/js/prettify/lang-vb.js
-
+3 -0docs/js/prettify/lang-vhdl.js
-
+2 -0docs/js/prettify/lang-wiki.js
-
+2 -0docs/js/prettify/lang-yaml.js
-
+1 -0docs/js/prettify/prettify.css
-
+33 -0docs/js/prettify/prettify.js
-
+2 -0docs/js/smooth-scroll.min.js
-
+133 -0docs/network/canvas.html
-
+144 -0docs/network/clustering.html
-
+103 -0docs/network/configure.html
-
+177 -0docs/network/edges.html
-
+162 -0docs/network/interaction.html
-
+125 -0docs/network/layout.html
-
+120 -0docs/network/new_network.html
-
+179 -0docs/network/nodes.html
-
+175 -0docs/network/physics.html
-
+110 -0docs/network/rendering.html
-
+126 -0docs/network/selection.html
-
+169 -0docs/network/view.html
-
+2 -2lib/network/modules/Clustering.js
+ 8
- 0
dist/vis.css
View File
+ 377
- 378
dist/vis.js
File diff suppressed because it is too large
View File
+ 1
- 1
dist/vis.min.css
File diff suppressed because it is too large
View File
+ 470
- 0
docs/css/bootstrap-theme.css
View File
| @ -0,0 +1,470 @@ | |||
| /*! | |||
| * Bootstrap v3.3.1 (http://getbootstrap.com) | |||
| * Copyright 2011-2014 Twitter, Inc. | |||
| * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) | |||
| */ | |||
| .btn-default, | |||
| .btn-primary, | |||
| .btn-success, | |||
| .btn-info, | |||
| .btn-warning, | |||
| .btn-danger { | |||
| text-shadow: 0 -1px 0 rgba(0, 0, 0, .2); | |||
| -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075); | |||
| box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075); | |||
| } | |||
| .btn-default:active, | |||
| .btn-primary:active, | |||
| .btn-success:active, | |||
| .btn-info:active, | |||
| .btn-warning:active, | |||
| .btn-danger:active, | |||
| .btn-default.active, | |||
| .btn-primary.active, | |||
| .btn-success.active, | |||
| .btn-info.active, | |||
| .btn-warning.active, | |||
| .btn-danger.active { | |||
| -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); | |||
| box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); | |||
| } | |||
| .btn-default .badge, | |||
| .btn-primary .badge, | |||
| .btn-success .badge, | |||
| .btn-info .badge, | |||
| .btn-warning .badge, | |||
| .btn-danger .badge { | |||
| text-shadow: none; | |||
| } | |||
| .btn:active, | |||
| .btn.active { | |||
| background-image: none; | |||
| } | |||
| .btn-default { | |||
| text-shadow: 0 1px 0 #fff; | |||
| background-image: -webkit-linear-gradient(top, #fff 0%, #e0e0e0 100%); | |||
| background-image: -o-linear-gradient(top, #fff 0%, #e0e0e0 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e0e0e0)); | |||
| background-image: linear-gradient(to bottom, #fff 0%, #e0e0e0 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); | |||
| background-repeat: repeat-x; | |||
| border-color: #dbdbdb; | |||
| border-color: #ccc; | |||
| } | |||
| .btn-default:hover, | |||
| .btn-default:focus { | |||
| background-color: #e0e0e0; | |||
| background-position: 0 -15px; | |||
| } | |||
| .btn-default:active, | |||
| .btn-default.active { | |||
| background-color: #e0e0e0; | |||
| border-color: #dbdbdb; | |||
| } | |||
| .btn-default:disabled, | |||
| .btn-default[disabled] { | |||
| background-color: #e0e0e0; | |||
| background-image: none; | |||
| } | |||
| .btn-primary { | |||
| background-image: -webkit-linear-gradient(top, #337ab7 0%, #265a88 100%); | |||
| background-image: -o-linear-gradient(top, #337ab7 0%, #265a88 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#265a88)); | |||
| background-image: linear-gradient(to bottom, #337ab7 0%, #265a88 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff265a88', GradientType=0); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); | |||
| background-repeat: repeat-x; | |||
| border-color: #245580; | |||
| } | |||
| .btn-primary:hover, | |||
| .btn-primary:focus { | |||
| background-color: #265a88; | |||
| background-position: 0 -15px; | |||
| } | |||
| .btn-primary:active, | |||
| .btn-primary.active { | |||
| background-color: #265a88; | |||
| border-color: #245580; | |||
| } | |||
| .btn-primary:disabled, | |||
| .btn-primary[disabled] { | |||
| background-color: #265a88; | |||
| background-image: none; | |||
| } | |||
| .btn-success { | |||
| background-image: -webkit-linear-gradient(top, #5cb85c 0%, #419641 100%); | |||
| background-image: -o-linear-gradient(top, #5cb85c 0%, #419641 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#419641)); | |||
| background-image: linear-gradient(to bottom, #5cb85c 0%, #419641 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); | |||
| background-repeat: repeat-x; | |||
| border-color: #3e8f3e; | |||
| } | |||
| .btn-success:hover, | |||
| .btn-success:focus { | |||
| background-color: #419641; | |||
| background-position: 0 -15px; | |||
| } | |||
| .btn-success:active, | |||
| .btn-success.active { | |||
| background-color: #419641; | |||
| border-color: #3e8f3e; | |||
| } | |||
| .btn-success:disabled, | |||
| .btn-success[disabled] { | |||
| background-color: #419641; | |||
| background-image: none; | |||
| } | |||
| .btn-info { | |||
| background-image: -webkit-linear-gradient(top, #5bc0de 0%, #2aabd2 100%); | |||
| background-image: -o-linear-gradient(top, #5bc0de 0%, #2aabd2 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#2aabd2)); | |||
| background-image: linear-gradient(to bottom, #5bc0de 0%, #2aabd2 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); | |||
| background-repeat: repeat-x; | |||
| border-color: #28a4c9; | |||
| } | |||
| .btn-info:hover, | |||
| .btn-info:focus { | |||
| background-color: #2aabd2; | |||
| background-position: 0 -15px; | |||
| } | |||
| .btn-info:active, | |||
| .btn-info.active { | |||
| background-color: #2aabd2; | |||
| border-color: #28a4c9; | |||
| } | |||
| .btn-info:disabled, | |||
| .btn-info[disabled] { | |||
| background-color: #2aabd2; | |||
| background-image: none; | |||
| } | |||
| .btn-warning { | |||
| background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #eb9316 100%); | |||
| background-image: -o-linear-gradient(top, #f0ad4e 0%, #eb9316 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#eb9316)); | |||
| background-image: linear-gradient(to bottom, #f0ad4e 0%, #eb9316 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); | |||
| background-repeat: repeat-x; | |||
| border-color: #e38d13; | |||
| } | |||
| .btn-warning:hover, | |||
| .btn-warning:focus { | |||
| background-color: #eb9316; | |||
| background-position: 0 -15px; | |||
| } | |||
| .btn-warning:active, | |||
| .btn-warning.active { | |||
| background-color: #eb9316; | |||
| border-color: #e38d13; | |||
| } | |||
| .btn-warning:disabled, | |||
| .btn-warning[disabled] { | |||
| background-color: #eb9316; | |||
| background-image: none; | |||
| } | |||
| .btn-danger { | |||
| background-image: -webkit-linear-gradient(top, #d9534f 0%, #c12e2a 100%); | |||
| background-image: -o-linear-gradient(top, #d9534f 0%, #c12e2a 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c12e2a)); | |||
| background-image: linear-gradient(to bottom, #d9534f 0%, #c12e2a 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); | |||
| background-repeat: repeat-x; | |||
| border-color: #b92c28; | |||
| } | |||
| .btn-danger:hover, | |||
| .btn-danger:focus { | |||
| background-color: #c12e2a; | |||
| background-position: 0 -15px; | |||
| } | |||
| .btn-danger:active, | |||
| .btn-danger.active { | |||
| background-color: #c12e2a; | |||
| border-color: #b92c28; | |||
| } | |||
| .btn-danger:disabled, | |||
| .btn-danger[disabled] { | |||
| background-color: #c12e2a; | |||
| background-image: none; | |||
| } | |||
| .thumbnail, | |||
| .img-thumbnail { | |||
| -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075); | |||
| box-shadow: 0 1px 2px rgba(0, 0, 0, .075); | |||
| } | |||
| .dropdown-menu > li > a:hover, | |||
| .dropdown-menu > li > a:focus { | |||
| background-color: #e8e8e8; | |||
| background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%); | |||
| background-image: -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8)); | |||
| background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .dropdown-menu > .active > a, | |||
| .dropdown-menu > .active > a:hover, | |||
| .dropdown-menu > .active > a:focus { | |||
| background-color: #2e6da4; | |||
| background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%); | |||
| background-image: -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4)); | |||
| background-image: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .navbar-default { | |||
| background-image: -webkit-linear-gradient(top, #fff 0%, #f8f8f8 100%); | |||
| background-image: -o-linear-gradient(top, #fff 0%, #f8f8f8 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f8f8f8)); | |||
| background-image: linear-gradient(to bottom, #fff 0%, #f8f8f8 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff8f8f8', GradientType=0); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); | |||
| background-repeat: repeat-x; | |||
| border-radius: 4px; | |||
| -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075); | |||
| box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075); | |||
| } | |||
| .navbar-default .navbar-nav > .open > a, | |||
| .navbar-default .navbar-nav > .active > a { | |||
| background-image: -webkit-linear-gradient(top, #dbdbdb 0%, #e2e2e2 100%); | |||
| background-image: -o-linear-gradient(top, #dbdbdb 0%, #e2e2e2 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#dbdbdb), to(#e2e2e2)); | |||
| background-image: linear-gradient(to bottom, #dbdbdb 0%, #e2e2e2 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdbdbdb', endColorstr='#ffe2e2e2', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075); | |||
| box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075); | |||
| } | |||
| .navbar-brand, | |||
| .navbar-nav > li > a { | |||
| text-shadow: 0 1px 0 rgba(255, 255, 255, .25); | |||
| } | |||
| .navbar-inverse { | |||
| background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #222 100%); | |||
| background-image: -o-linear-gradient(top, #3c3c3c 0%, #222 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#3c3c3c), to(#222)); | |||
| background-image: linear-gradient(to bottom, #3c3c3c 0%, #222 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .navbar-inverse .navbar-nav > .open > a, | |||
| .navbar-inverse .navbar-nav > .active > a { | |||
| background-image: -webkit-linear-gradient(top, #080808 0%, #0f0f0f 100%); | |||
| background-image: -o-linear-gradient(top, #080808 0%, #0f0f0f 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#080808), to(#0f0f0f)); | |||
| background-image: linear-gradient(to bottom, #080808 0%, #0f0f0f 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff080808', endColorstr='#ff0f0f0f', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25); | |||
| box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25); | |||
| } | |||
| .navbar-inverse .navbar-brand, | |||
| .navbar-inverse .navbar-nav > li > a { | |||
| text-shadow: 0 -1px 0 rgba(0, 0, 0, .25); | |||
| } | |||
| .navbar-static-top, | |||
| .navbar-fixed-top, | |||
| .navbar-fixed-bottom { | |||
| border-radius: 0; | |||
| } | |||
| @media (max-width: 767px) { | |||
| .navbar .navbar-nav .open .dropdown-menu > .active > a, | |||
| .navbar .navbar-nav .open .dropdown-menu > .active > a:hover, | |||
| .navbar .navbar-nav .open .dropdown-menu > .active > a:focus { | |||
| color: #fff; | |||
| background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%); | |||
| background-image: -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4)); | |||
| background-image: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| } | |||
| .alert { | |||
| text-shadow: 0 1px 0 rgba(255, 255, 255, .2); | |||
| -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05); | |||
| box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05); | |||
| } | |||
| .alert-success { | |||
| background-image: -webkit-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%); | |||
| background-image: -o-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#c8e5bc)); | |||
| background-image: linear-gradient(to bottom, #dff0d8 0%, #c8e5bc 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| border-color: #b2dba1; | |||
| } | |||
| .alert-info { | |||
| background-image: -webkit-linear-gradient(top, #d9edf7 0%, #b9def0 100%); | |||
| background-image: -o-linear-gradient(top, #d9edf7 0%, #b9def0 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#b9def0)); | |||
| background-image: linear-gradient(to bottom, #d9edf7 0%, #b9def0 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| border-color: #9acfea; | |||
| } | |||
| .alert-warning { | |||
| background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%); | |||
| background-image: -o-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#f8efc0)); | |||
| background-image: linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| border-color: #f5e79e; | |||
| } | |||
| .alert-danger { | |||
| background-image: -webkit-linear-gradient(top, #f2dede 0%, #e7c3c3 100%); | |||
| background-image: -o-linear-gradient(top, #f2dede 0%, #e7c3c3 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#e7c3c3)); | |||
| background-image: linear-gradient(to bottom, #f2dede 0%, #e7c3c3 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| border-color: #dca7a7; | |||
| } | |||
| .progress { | |||
| background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%); | |||
| background-image: -o-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#f5f5f5)); | |||
| background-image: linear-gradient(to bottom, #ebebeb 0%, #f5f5f5 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff5f5f5', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .progress-bar { | |||
| background-image: -webkit-linear-gradient(top, #337ab7 0%, #286090 100%); | |||
| background-image: -o-linear-gradient(top, #337ab7 0%, #286090 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#286090)); | |||
| background-image: linear-gradient(to bottom, #337ab7 0%, #286090 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff286090', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .progress-bar-success { | |||
| background-image: -webkit-linear-gradient(top, #5cb85c 0%, #449d44 100%); | |||
| background-image: -o-linear-gradient(top, #5cb85c 0%, #449d44 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#449d44)); | |||
| background-image: linear-gradient(to bottom, #5cb85c 0%, #449d44 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .progress-bar-info { | |||
| background-image: -webkit-linear-gradient(top, #5bc0de 0%, #31b0d5 100%); | |||
| background-image: -o-linear-gradient(top, #5bc0de 0%, #31b0d5 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#31b0d5)); | |||
| background-image: linear-gradient(to bottom, #5bc0de 0%, #31b0d5 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff31b0d5', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .progress-bar-warning { | |||
| background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #ec971f 100%); | |||
| background-image: -o-linear-gradient(top, #f0ad4e 0%, #ec971f 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#ec971f)); | |||
| background-image: linear-gradient(to bottom, #f0ad4e 0%, #ec971f 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffec971f', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .progress-bar-danger { | |||
| background-image: -webkit-linear-gradient(top, #d9534f 0%, #c9302c 100%); | |||
| background-image: -o-linear-gradient(top, #d9534f 0%, #c9302c 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c9302c)); | |||
| background-image: linear-gradient(to bottom, #d9534f 0%, #c9302c 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc9302c', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .progress-bar-striped { | |||
| background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); | |||
| background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); | |||
| background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent); | |||
| } | |||
| .list-group { | |||
| border-radius: 4px; | |||
| -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075); | |||
| box-shadow: 0 1px 2px rgba(0, 0, 0, .075); | |||
| } | |||
| .list-group-item.active, | |||
| .list-group-item.active:hover, | |||
| .list-group-item.active:focus { | |||
| text-shadow: 0 -1px 0 #286090; | |||
| background-image: -webkit-linear-gradient(top, #337ab7 0%, #2b669a 100%); | |||
| background-image: -o-linear-gradient(top, #337ab7 0%, #2b669a 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2b669a)); | |||
| background-image: linear-gradient(to bottom, #337ab7 0%, #2b669a 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2b669a', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| border-color: #2b669a; | |||
| } | |||
| .list-group-item.active .badge, | |||
| .list-group-item.active:hover .badge, | |||
| .list-group-item.active:focus .badge { | |||
| text-shadow: none; | |||
| } | |||
| .panel { | |||
| -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05); | |||
| box-shadow: 0 1px 2px rgba(0, 0, 0, .05); | |||
| } | |||
| .panel-default > .panel-heading { | |||
| background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%); | |||
| background-image: -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8)); | |||
| background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .panel-primary > .panel-heading { | |||
| background-image: -webkit-linear-gradient(top, #337ab7 0%, #2e6da4 100%); | |||
| background-image: -o-linear-gradient(top, #337ab7 0%, #2e6da4 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#337ab7), to(#2e6da4)); | |||
| background-image: linear-gradient(to bottom, #337ab7 0%, #2e6da4 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff337ab7', endColorstr='#ff2e6da4', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .panel-success > .panel-heading { | |||
| background-image: -webkit-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%); | |||
| background-image: -o-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#d0e9c6)); | |||
| background-image: linear-gradient(to bottom, #dff0d8 0%, #d0e9c6 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffd0e9c6', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .panel-info > .panel-heading { | |||
| background-image: -webkit-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%); | |||
| background-image: -o-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#c4e3f3)); | |||
| background-image: linear-gradient(to bottom, #d9edf7 0%, #c4e3f3 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffc4e3f3', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .panel-warning > .panel-heading { | |||
| background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%); | |||
| background-image: -o-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#faf2cc)); | |||
| background-image: linear-gradient(to bottom, #fcf8e3 0%, #faf2cc 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fffaf2cc', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .panel-danger > .panel-heading { | |||
| background-image: -webkit-linear-gradient(top, #f2dede 0%, #ebcccc 100%); | |||
| background-image: -o-linear-gradient(top, #f2dede 0%, #ebcccc 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#ebcccc)); | |||
| background-image: linear-gradient(to bottom, #f2dede 0%, #ebcccc 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffebcccc', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| } | |||
| .well { | |||
| background-image: -webkit-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%); | |||
| background-image: -o-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%); | |||
| background-image: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#f5f5f5)); | |||
| background-image: linear-gradient(to bottom, #e8e8e8 0%, #f5f5f5 100%); | |||
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0); | |||
| background-repeat: repeat-x; | |||
| border-color: #dcdcdc; | |||
| -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1); | |||
| box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1); | |||
| } | |||
| /*# sourceMappingURL=bootstrap-theme.css.map */ | |||
+ 1
- 0
docs/css/bootstrap-theme.css.map
File diff suppressed because it is too large
View File
+ 5
- 0
docs/css/bootstrap-theme.min.css
File diff suppressed because it is too large
View File
+ 6332
- 0
docs/css/bootstrap.css
File diff suppressed because it is too large
View File
+ 1
- 0
docs/css/bootstrap.css.map
File diff suppressed because it is too large
View File
+ 5
- 0
docs/css/bootstrap.min.css
File diff suppressed because it is too large
View File
+ 142
- 0
docs/css/carousel.css
View File
| @ -0,0 +1,142 @@ | |||
| /* GLOBAL STYLES | |||
| -------------------------------------------------- */ | |||
| /* Padding below the footer and lighter body text */ | |||
| body { | |||
| padding-bottom: 40px; | |||
| color: #5a5a5a; | |||
| } | |||
| /* CUSTOMIZE THE NAVBAR | |||
| -------------------------------------------------- */ | |||
| /* Special class on .container surrounding .navbar, used for positioning it into place. */ | |||
| .navbar-wrapper { | |||
| position: absolute; | |||
| top: 0; | |||
| right: 0; | |||
| left: 0; | |||
| z-index: 20; | |||
| } | |||
| /* Flip around the padding for proper display in narrow viewports */ | |||
| .navbar-wrapper > .container { | |||
| padding-right: 0; | |||
| padding-left: 0; | |||
| } | |||
| .navbar-wrapper .navbar { | |||
| padding-right: 15px; | |||
| padding-left: 15px; | |||
| } | |||
| .navbar-wrapper .navbar .container { | |||
| width: auto; | |||
| } | |||
| /* CUSTOMIZE THE CAROUSEL | |||
| -------------------------------------------------- */ | |||
| /* Carousel base class */ | |||
| .carousel { | |||
| height: 500px; | |||
| margin-bottom: 60px; | |||
| } | |||
| /* Since positioning the image, we need to help out the caption */ | |||
| .carousel-caption { | |||
| z-index: 10; | |||
| /*background-color:rgba(0,0,0,0.2);*/ | |||
| /*padding-left: 20px;*/ | |||
| /*padding-right:20px;*/ | |||
| /*border-radius:30px;*/ | |||
| } | |||
| /* Declare heights because of positioning of img element */ | |||
| .carousel .item { | |||
| height: 500px; | |||
| background-color: #064880; | |||
| } | |||
| .carousel .item.dark { | |||
| background-color: #06132c; | |||
| } | |||
| .carousel-inner > .item > img { | |||
| position: absolute; | |||
| top: 0; | |||
| left: 0; | |||
| min-width: 100%; | |||
| height: 800px; | |||
| } | |||
| /* MARKETING CONTENT | |||
| -------------------------------------------------- */ | |||
| /* Center align the text within the three columns below the carousel */ | |||
| .marketing .col-lg-3 { | |||
| margin-bottom: 20px; | |||
| text-align: center; | |||
| } | |||
| .marketing h2 { | |||
| font-weight: normal; | |||
| } | |||
| .marketing .col-lg-3 p { | |||
| margin-right: 10px; | |||
| margin-left: 10px; | |||
| } | |||
| /* Featurettes | |||
| ------------------------- */ | |||
| .featurette-divider { | |||
| margin: 80px 0; /* Space out the Bootstrap <hr> more */ | |||
| border-top: 1px solid #d2d2d2; | |||
| } | |||
| /* Thin out the marketing headings */ | |||
| .featurette-heading { | |||
| font-weight: 300; | |||
| line-height: 1; | |||
| letter-spacing: -1px; | |||
| } | |||
| /* RESPONSIVE CSS | |||
| -------------------------------------------------- */ | |||
| @media (min-width: 768px) { | |||
| /* Navbar positioning foo */ | |||
| .navbar-wrapper { | |||
| margin-top: 20px; | |||
| } | |||
| .navbar-wrapper .container { | |||
| padding-right: 15px; | |||
| padding-left: 15px; | |||
| } | |||
| .navbar-wrapper .navbar { | |||
| padding-right: 0; | |||
| padding-left: 0; | |||
| } | |||
| /* The navbar becomes detached from the top, so we round the corners */ | |||
| .navbar-wrapper .navbar { | |||
| border-radius: 4px; | |||
| } | |||
| /* Bump up size of carousel content */ | |||
| .carousel-caption p { | |||
| margin-bottom: 20px; | |||
| font-size: 21px; | |||
| line-height: 1.4; | |||
| } | |||
| .featurette-heading { | |||
| font-size: 50px; | |||
| } | |||
| } | |||
| @media (min-width: 992px) { | |||
| .featurette-heading { | |||
| margin-top: 120px; | |||
| } | |||
| } | |||
+ 61
- 0
docs/css/examples.css
View File
| @ -0,0 +1,61 @@ | |||
| body { | |||
| font-family: Lustria,Georgia,Times,"Times New Roman",serif !important; | |||
| background: url('../images/crossword.png') /* Background pattern from subtlepatterns.com */ | |||
| } | |||
| div.contentWrapper { | |||
| padding:10px; | |||
| } | |||
| div.navbar-wrapper { | |||
| background-color:#07508E; | |||
| border-bottom: 3px solid #ffffff; | |||
| font-size:16px; | |||
| } | |||
| pre { | |||
| width:450px; | |||
| height:552px; | |||
| overflow:auto; | |||
| } | |||
| #visualization { | |||
| display:block; | |||
| margin-left:470px; | |||
| margin-top:-562px; | |||
| width:500px; | |||
| height:552px; | |||
| border: 1px solid #dddddd; | |||
| border-radius:4px; | |||
| background-color:#fcfcfc; | |||
| } | |||
| div.textHTMLContent { | |||
| margin-top:10px; | |||
| margin-bottom:10px; | |||
| display:block; | |||
| width:800px; | |||
| } | |||
| img.example { | |||
| border:1px solid #dddddd; | |||
| width:250px; | |||
| height:250px; | |||
| border-radius:10px; | |||
| margin-top:10px; | |||
| } | |||
| div.exampleTitle { | |||
| position:relative; | |||
| top:-7px; | |||
| width:100%; | |||
| max-width:250px; | |||
| height:30px; | |||
| border: 1px solid #dddddd; | |||
| background-color: #526b84; | |||
| color:#ffffff; | |||
| text-align:center; | |||
| vertical-align:middle; | |||
| line-height: 30px; | |||
| border-bottom-left-radius:5px; | |||
| border-bottom-right-radius:5px; | |||
| } | |||
+ 85
- 0
docs/css/newdocs.css
View File
| @ -0,0 +1,85 @@ | |||
| html { | |||
| height:100%; | |||
| } | |||
| body { | |||
| font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important; | |||
| /*font-family: Lustria, Georgia, Times, "Times New Roman", serif !important;*/ | |||
| height:100%; | |||
| font-size:16px; | |||
| background: url('../../images/crosswordStrong.png') /* Background pattern from subtlepatterns.com */ | |||
| } | |||
| img.icon { | |||
| position:relative; | |||
| top:-2px; | |||
| } | |||
| div.navbar-wrapper { | |||
| background-color:#07508E; | |||
| border-bottom: 3px solid #ffffff; | |||
| font-size:16px; | |||
| } | |||
| div.blogHeader { | |||
| margin-left:auto; | |||
| margin-right:auto; | |||
| text-align:center; | |||
| width:910px; | |||
| padding: 0px 30px 0px 30px; | |||
| margin-top:-150px; | |||
| color:#ffffff; | |||
| text-shadow: 1px 1px 3px rgba(0, 0, 0, 1); | |||
| margin-bottom:60px; | |||
| } | |||
| div.full { | |||
| min-height:100%; | |||
| box-shadow:0px 2px 10px rgba(0,0,0,0.4); | |||
| padding-left:20px; | |||
| padding-right:20px; | |||
| background-color:#ffffff; | |||
| } | |||
| table.moduleTable { | |||
| border:1px solid #eeeeee; | |||
| font-size:14px; | |||
| margin-left:20px; | |||
| max-width: 900px; | |||
| } | |||
| table.moduleTable td{ | |||
| min-width: 80px; | |||
| padding:2px 5px 2px 5px; | |||
| height:35px; | |||
| } | |||
| table.moduleTable tr{ | |||
| border:1px solid #eeeeee; | |||
| vertical-align: top; | |||
| } | |||
| tr.header { | |||
| color: #1f3350; | |||
| background-color: #cccccc; | |||
| border-bottom:1px solid #999999 !important; | |||
| font-size:16px; | |||
| font-style:italic; | |||
| } | |||
| td.mid { | |||
| background-color: #f7f7f7; | |||
| font-style:italic; | |||
| } | |||
| td.properties { | |||
| width:150px; | |||
| } | |||
| p { | |||
| max-width:1000px; | |||
| } | |||
+ 2320
- 0
docs/js/bootstrap.js
File diff suppressed because it is too large
View File
+ 7
- 0
docs/js/bootstrap.min.js
File diff suppressed because it is too large
View File
+ 26
- 0
docs/js/docs.min.js
File diff suppressed because it is too large
View File
+ 51
- 0
docs/js/ie-emulation-modes-warning.js
View File
| @ -0,0 +1,51 @@ | |||
| // NOTICE!! DO NOT USE ANY OF THIS JAVASCRIPT | |||
| // IT'S JUST JUNK FOR OUR DOCS! | |||
| // ++++++++++++++++++++++++++++++++++++++++++ | |||
| /*! | |||
| * Copyright 2014 Twitter, Inc. | |||
| * | |||
| * Licensed under the Creative Commons Attribution 3.0 Unported License. For | |||
| * details, see http://creativecommons.org/licenses/by/3.0/. | |||
| */ | |||
| // Intended to prevent false-positive bug reports about Bootstrap not working properly in old versions of IE due to folks testing using IE's unreliable emulation modes. | |||
| (function () { | |||
| 'use strict'; | |||
| function emulatedIEMajorVersion() { | |||
| var groups = /MSIE ([0-9.]+)/.exec(window.navigator.userAgent) | |||
| if (groups === null) { | |||
| return null | |||
| } | |||
| var ieVersionNum = parseInt(groups[1], 10) | |||
| var ieMajorVersion = Math.floor(ieVersionNum) | |||
| return ieMajorVersion | |||
| } | |||
| function actualNonEmulatedIEMajorVersion() { | |||
| // Detects the actual version of IE in use, even if it's in an older-IE emulation mode. | |||
| // IE JavaScript conditional compilation docs: http://msdn.microsoft.com/en-us/library/ie/121hztk3(v=vs.94).aspx | |||
| // @cc_on docs: http://msdn.microsoft.com/en-us/library/ie/8ka90k2e(v=vs.94).aspx | |||
| var jscriptVersion = new Function('/*@cc_on return @_jscript_version; @*/')() // jshint ignore:line | |||
| if (jscriptVersion === undefined) { | |||
| return 11 // IE11+ not in emulation mode | |||
| } | |||
| if (jscriptVersion < 9) { | |||
| return 8 // IE8 (or lower; haven't tested on IE<8) | |||
| } | |||
| return jscriptVersion // IE9 or IE10 in any mode, or IE11 in non-IE11 mode | |||
| } | |||
| var ua = window.navigator.userAgent | |||
| if (ua.indexOf('Opera') > -1 || ua.indexOf('Presto') > -1) { | |||
| return // Opera, which might pretend to be IE | |||
| } | |||
| var emulated = emulatedIEMajorVersion() | |||
| if (emulated === null) { | |||
| return // Not IE | |||
| } | |||
| var nonEmulated = actualNonEmulatedIEMajorVersion() | |||
| if (emulated !== nonEmulated) { | |||
| window.alert('WARNING: You appear to be using IE' + nonEmulated + ' in IE' + emulated + ' emulation mode.\nIE emulation modes can behave significantly differently from ACTUAL older versions of IE.\nPLEASE DON\'T FILE BOOTSTRAP BUGS based on testing in IE emulation modes!') | |||
| } | |||
| })(); | |||
+ 22
- 0
docs/js/ie10-viewport-bug-workaround.js
View File
| @ -0,0 +1,22 @@ | |||
| /*! | |||
| * IE10 viewport hack for Surface/desktop Windows 8 bug | |||
| * Copyright 2014 Twitter, Inc. | |||
| * Licensed under the Creative Commons Attribution 3.0 Unported License. For | |||
| * details, see http://creativecommons.org/licenses/by/3.0/. | |||
| */ | |||
| // See the Getting Started docs for more information: | |||
| // http://getbootstrap.com/getting-started/#support-ie10-width | |||
| (function () { | |||
| 'use strict'; | |||
| if (navigator.userAgent.match(/IEMobile\/10\.0/)) { | |||
| var msViewportStyle = document.createElement('style') | |||
| msViewportStyle.appendChild( | |||
| document.createTextNode( | |||
| '@-ms-viewport{width:auto!important}' | |||
| ) | |||
| ) | |||
| document.querySelector('head').appendChild(msViewportStyle) | |||
| } | |||
| })(); | |||
+ 4
- 0
docs/js/jquery.min.js
File diff suppressed because it is too large
View File
+ 2
- 0
docs/js/prettify/lang-apollo.js
View File
| @ -0,0 +1,2 @@ | |||
| PR.registerLangHandler(PR.createSimpleLexer([["com",/^#[^\r\n]*/,null,"#"],["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"],["str",/^\"(?:[^\"\\]|\\[\s\S])*(?:\"|$)/,null,'"']],[["kwd",/^(?:ADS|AD|AUG|BZF|BZMF|CAE|CAF|CA|CCS|COM|CS|DAS|DCA|DCOM|DCS|DDOUBL|DIM|DOUBLE|DTCB|DTCF|DV|DXCH|EDRUPT|EXTEND|INCR|INDEX|NDX|INHINT|LXCH|MASK|MSK|MP|MSU|NOOP|OVSK|QXCH|RAND|READ|RELINT|RESUME|RETURN|ROR|RXOR|SQUARE|SU|TCR|TCAA|OVSK|TCF|TC|TS|WAND|WOR|WRITE|XCH|XLQ|XXALQ|ZL|ZQ|ADD|ADZ|SUB|SUZ|MPY|MPR|MPZ|DVP|COM|ABS|CLA|CLZ|LDQ|STO|STQ|ALS|LLS|LRS|TRA|TSQ|TMI|TOV|AXT|TIX|DLY|INP|OUT)\s/, | |||
| null],["typ",/^(?:-?GENADR|=MINUS|2BCADR|VN|BOF|MM|-?2CADR|-?[1-6]DNADR|ADRES|BBCON|[SE]?BANK\=?|BLOCK|BNKSUM|E?CADR|COUNT\*?|2?DEC\*?|-?DNCHAN|-?DNPTR|EQUALS|ERASE|MEMORY|2?OCT|REMADR|SETLOC|SUBRO|ORG|BSS|BES|SYN|EQU|DEFINE|END)\s/,null],["lit",/^\'(?:-*(?:\w|\\[\x21-\x7e])(?:[\w-]*|\\[\x21-\x7e])[=!?]?)?/],["pln",/^-*(?:[!-z_]|\\[\x21-\x7e])(?:[\w-]*|\\[\x21-\x7e])[=!?]?/i],["pun",/^[^\w\t\n\r \xA0()\"\\\';]+/]]),["apollo","agc","aea"]) | |||
+ 2
- 0
docs/js/prettify/lang-css.js
View File
| @ -0,0 +1,2 @@ | |||
| PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[ \t\r\n\f]+/,null," \t\r\n\u000c"]],[["str",/^\"(?:[^\n\r\f\\\"]|\\(?:\r\n?|\n|\f)|\\[\s\S])*\"/,null],["str",/^\'(?:[^\n\r\f\\\']|\\(?:\r\n?|\n|\f)|\\[\s\S])*\'/,null],["lang-css-str",/^url\(([^\)\"\']*)\)/i],["kwd",/^(?:url|rgb|\!important|@import|@page|@media|@charset|inherit)(?=[^\-\w]|$)/i,null],["lang-css-kw",/^(-?(?:[_a-z]|(?:\\[0-9a-f]+ ?))(?:[_a-z0-9\-]|\\(?:\\[0-9a-f]+ ?))*)\s*:/i],["com",/^\/\*[^*]*\*+(?:[^\/*][^*]*\*+)*\//], | |||
| ["com",/^(?:<!--|--\>)/],["lit",/^(?:\d+|\d*\.\d+)(?:%|[a-z]+)?/i],["lit",/^#(?:[0-9a-f]{3}){1,2}/i],["pln",/^-?(?:[_a-z]|(?:\\[\da-f]+ ?))(?:[_a-z\d\-]|\\(?:\\[\da-f]+ ?))*/i],["pun",/^[^\s\w\'\"]+/]]),["css"]);PR.registerLangHandler(PR.createSimpleLexer([],[["kwd",/^-?(?:[_a-z]|(?:\\[\da-f]+ ?))(?:[_a-z\d\-]|\\(?:\\[\da-f]+ ?))*/i]]),["css-kw"]);PR.registerLangHandler(PR.createSimpleLexer([],[["str",/^[^\)\"\']+/]]),["css-str"]) | |||
+ 2
- 0
docs/js/prettify/lang-hs.js
View File
| @ -0,0 +1,2 @@ | |||
| PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\x0B\x0C\r ]+/,null,"\t\n\u000b\u000c\r "],["str",/^\"(?:[^\"\\\n\x0C\r]|\\[\s\S])*(?:\"|$)/,null,'"'],["str",/^\'(?:[^\'\\\n\x0C\r]|\\[^&])\'?/,null,"'"],["lit",/^(?:0o[0-7]+|0x[\da-f]+|\d+(?:\.\d+)?(?:e[+\-]?\d+)?)/i,null,"0123456789"]],[["com",/^(?:(?:--+(?:[^\r\n\x0C]*)?)|(?:\{-(?:[^-]|-+[^-\}])*-\}))/],["kwd",/^(?:case|class|data|default|deriving|do|else|if|import|in|infix|infixl|infixr|instance|let|module|newtype|of|then|type|where|_)(?=[^a-zA-Z0-9\']|$)/, | |||
| null],["pln",/^(?:[A-Z][\w\']*\.)*[a-zA-Z][\w\']*/],["pun",/^[^\t\n\x0B\x0C\r a-zA-Z0-9\'\"]+/]]),["hs"]) | |||
+ 2
- 0
docs/js/prettify/lang-lisp.js
View File
| @ -0,0 +1,2 @@ | |||
| PR.registerLangHandler(PR.createSimpleLexer([["opn",/^\(/,null,"("],["clo",/^\)/,null,")"],["com",/^;[^\r\n]*/,null,";"],["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"],["str",/^\"(?:[^\"\\]|\\[\s\S])*(?:\"|$)/,null,'"']],[["kwd",/^(?:block|c[ad]+r|catch|con[ds]|def(?:ine|un)|do|eq|eql|equal|equalp|eval-when|flet|format|go|if|labels|lambda|let|load-time-value|locally|macrolet|multiple-value-call|nil|progn|progv|quote|require|return-from|setq|symbol-macrolet|t|tagbody|the|throw|unwind)\b/, | |||
| null],["lit",/^[+\-]?(?:0x[0-9a-f]+|\d+\/\d+|(?:\.\d+|\d+(?:\.\d*)?)(?:[ed][+\-]?\d+)?)/i],["lit",/^\'(?:-*(?:\w|\\[\x21-\x7e])(?:[\w-]*|\\[\x21-\x7e])[=!?]?)?/],["pln",/^-*(?:[a-z_]|\\[\x21-\x7e])(?:[\w-]*|\\[\x21-\x7e])[=!?]?/i],["pun",/^[^\w\t\n\r \xA0()\"\\\';]+/]]),["cl","el","lisp","scm"]) | |||
+ 2
- 0
docs/js/prettify/lang-lua.js
View File
| @ -0,0 +1,2 @@ | |||
| PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"],["str",/^(?:\"(?:[^\"\\]|\\[\s\S])*(?:\"|$)|\'(?:[^\'\\]|\\[\s\S])*(?:\'|$))/,null,"\"'"]],[["com",/^--(?:\[(=*)\[[\s\S]*?(?:\]\1\]|$)|[^\r\n]*)/],["str",/^\[(=*)\[[\s\S]*?(?:\]\1\]|$)/],["kwd",/^(?:and|break|do|else|elseif|end|false|for|function|if|in|local|nil|not|or|repeat|return|then|true|until|while)\b/,null],["lit",/^[+-]?(?:0x[\da-f]+|(?:(?:\.\d+|\d+(?:\.\d*)?)(?:e[+\-]?\d+)?))/i], | |||
| ["pln",/^[a-z_]\w*/i],["pun",/^[^\w\t\n\r \xA0][^\w\t\n\r \xA0\"\'\-\+=]*/]]),["lua"]) | |||
+ 2
- 0
docs/js/prettify/lang-ml.js
View File
| @ -0,0 +1,2 @@ | |||
| PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"],["com",/^#(?:if[\t\n\r \xA0]+(?:[a-z_$][\w\']*|``[^\r\n\t`]*(?:``|$))|else|endif|light)/i,null,"#"],["str",/^(?:\"(?:[^\"\\]|\\[\s\S])*(?:\"|$)|\'(?:[^\'\\]|\\[\s\S])*(?:\'|$))/,null,"\"'"]],[["com",/^(?:\/\/[^\r\n]*|\(\*[\s\S]*?\*\))/],["kwd",/^(?:abstract|and|as|assert|begin|class|default|delegate|do|done|downcast|downto|elif|else|end|exception|extern|false|finally|for|fun|function|if|in|inherit|inline|interface|internal|lazy|let|match|member|module|mutable|namespace|new|null|of|open|or|override|private|public|rec|return|static|struct|then|to|true|try|type|upcast|use|val|void|when|while|with|yield|asr|land|lor|lsl|lsr|lxor|mod|sig|atomic|break|checked|component|const|constraint|constructor|continue|eager|event|external|fixed|functor|global|include|method|mixin|object|parallel|process|protected|pure|sealed|trait|virtual|volatile)\b/], | |||
| ["lit",/^[+\-]?(?:0x[\da-f]+|(?:(?:\.\d+|\d+(?:\.\d*)?)(?:e[+\-]?\d+)?))/i],["pln",/^(?:[a-z_]\w*[!?#]?|``[^\r\n\t`]*(?:``|$))/i],["pun",/^[^\t\n\r \xA0\"\'\w]+/]]),["fs","ml"]) | |||
+ 1
- 0
docs/js/prettify/lang-proto.js
View File
| @ -0,0 +1 @@ | |||
| PR.registerLangHandler(PR.sourceDecorator({keywords:"bool bytes default double enum extend extensions false fixed32 fixed64 float group import int32 int64 max message option optional package repeated required returns rpc service sfixed32 sfixed64 sint32 sint64 string syntax to true uint32 uint64",cStyleComments:true}),["proto"]) | |||
+ 2
- 0
docs/js/prettify/lang-scala.js
View File
| @ -0,0 +1,2 @@ | |||
| PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"],["str",/^(?:"(?:(?:""(?:""?(?!")|[^\\"]|\\.)*"{0,3})|(?:[^"\r\n\\]|\\.)*"?))/,null,'"'],["lit",/^`(?:[^\r\n\\`]|\\.)*`?/,null,"`"],["pun",/^[!#%&()*+,\-:;<=>?@\[\\\]^{|}~]+/,null,"!#%&()*+,-:;<=>?@[\\]^{|}~"]],[["str",/^'(?:[^\r\n\\']|\\(?:'|[^\r\n']+))'/],["lit",/^'[a-zA-Z_$][\w$]*(?!['$\w])/],["kwd",/^(?:abstract|case|catch|class|def|do|else|extends|final|finally|for|forSome|if|implicit|import|lazy|match|new|object|override|package|private|protected|requires|return|sealed|super|throw|trait|try|type|val|var|while|with|yield)\b/], | |||
| ["lit",/^(?:true|false|null|this)\b/],["lit",/^(?:(?:0(?:[0-7]+|X[0-9A-F]+))L?|(?:(?:0|[1-9][0-9]*)(?:(?:\.[0-9]+)?(?:E[+\-]?[0-9]+)?F?|L?))|\\.[0-9]+(?:E[+\-]?[0-9]+)?F?)/i],["typ",/^[$_]*[A-Z][_$A-Z0-9]*[a-z][\w$]*/],["pln",/^[$a-zA-Z_][\w$]*/],["com",/^\/(?:\/.*|\*(?:\/|\**[^*/])*(?:\*+\/?)?)/],["pun",/^(?:\.+|\/)/]]),["scala"]) | |||
+ 2
- 0
docs/js/prettify/lang-sql.js
View File
| @ -0,0 +1,2 @@ | |||
| PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"],["str",/^(?:"(?:[^\"\\]|\\.)*"|'(?:[^\'\\]|\\.)*')/,null,"\"'"]],[["com",/^(?:--[^\r\n]*|\/\*[\s\S]*?(?:\*\/|$))/],["kwd",/^(?:ADD|ALL|ALTER|AND|ANY|AS|ASC|AUTHORIZATION|BACKUP|BEGIN|BETWEEN|BREAK|BROWSE|BULK|BY|CASCADE|CASE|CHECK|CHECKPOINT|CLOSE|CLUSTERED|COALESCE|COLLATE|COLUMN|COMMIT|COMPUTE|CONSTRAINT|CONTAINS|CONTAINSTABLE|CONTINUE|CONVERT|CREATE|CROSS|CURRENT|CURRENT_DATE|CURRENT_TIME|CURRENT_TIMESTAMP|CURRENT_USER|CURSOR|DATABASE|DBCC|DEALLOCATE|DECLARE|DEFAULT|DELETE|DENY|DESC|DISK|DISTINCT|DISTRIBUTED|DOUBLE|DROP|DUMMY|DUMP|ELSE|END|ERRLVL|ESCAPE|EXCEPT|EXEC|EXECUTE|EXISTS|EXIT|FETCH|FILE|FILLFACTOR|FOR|FOREIGN|FREETEXT|FREETEXTTABLE|FROM|FULL|FUNCTION|GOTO|GRANT|GROUP|HAVING|HOLDLOCK|IDENTITY|IDENTITYCOL|IDENTITY_INSERT|IF|IN|INDEX|INNER|INSERT|INTERSECT|INTO|IS|JOIN|KEY|KILL|LEFT|LIKE|LINENO|LOAD|NATIONAL|NOCHECK|NONCLUSTERED|NOT|NULL|NULLIF|OF|OFF|OFFSETS|ON|OPEN|OPENDATASOURCE|OPENQUERY|OPENROWSET|OPENXML|OPTION|OR|ORDER|OUTER|OVER|PERCENT|PLAN|PRECISION|PRIMARY|PRINT|PROC|PROCEDURE|PUBLIC|RAISERROR|READ|READTEXT|RECONFIGURE|REFERENCES|REPLICATION|RESTORE|RESTRICT|RETURN|REVOKE|RIGHT|ROLLBACK|ROWCOUNT|ROWGUIDCOL|RULE|SAVE|SCHEMA|SELECT|SESSION_USER|SET|SETUSER|SHUTDOWN|SOME|STATISTICS|SYSTEM_USER|TABLE|TEXTSIZE|THEN|TO|TOP|TRAN|TRANSACTION|TRIGGER|TRUNCATE|TSEQUAL|UNION|UNIQUE|UPDATE|UPDATETEXT|USE|USER|VALUES|VARYING|VIEW|WAITFOR|WHEN|WHERE|WHILE|WITH|WRITETEXT)(?=[^\w-]|$)/i, | |||
| null],["lit",/^[+-]?(?:0x[\da-f]+|(?:(?:\.\d+|\d+(?:\.\d*)?)(?:e[+\-]?\d+)?))/i],["pln",/^[a-z_][\w-]*/i],["pun",/^[^\w\t\n\r \xA0\"\'][^\w\t\n\r \xA0+\-\"\']*/]]),["sql"]) | |||
+ 2
- 0
docs/js/prettify/lang-vb.js
View File
| @ -0,0 +1,2 @@ | |||
| PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\r \xA0\u2028\u2029]+/,null,"\t\n\r \u00a0\u2028\u2029"],["str",/^(?:[\"\u201C\u201D](?:[^\"\u201C\u201D]|[\"\u201C\u201D]{2})(?:[\"\u201C\u201D]c|$)|[\"\u201C\u201D](?:[^\"\u201C\u201D]|[\"\u201C\u201D]{2})*(?:[\"\u201C\u201D]|$))/i,null,'"\u201c\u201d'],["com",/^[\'\u2018\u2019][^\r\n\u2028\u2029]*/,null,"'\u2018\u2019"]],[["kwd",/^(?:AddHandler|AddressOf|Alias|And|AndAlso|Ansi|As|Assembly|Auto|Boolean|ByRef|Byte|ByVal|Call|Case|Catch|CBool|CByte|CChar|CDate|CDbl|CDec|Char|CInt|Class|CLng|CObj|Const|CShort|CSng|CStr|CType|Date|Decimal|Declare|Default|Delegate|Dim|DirectCast|Do|Double|Each|Else|ElseIf|End|EndIf|Enum|Erase|Error|Event|Exit|Finally|For|Friend|Function|Get|GetType|GoSub|GoTo|Handles|If|Implements|Imports|In|Inherits|Integer|Interface|Is|Let|Lib|Like|Long|Loop|Me|Mod|Module|MustInherit|MustOverride|MyBase|MyClass|Namespace|New|Next|Not|NotInheritable|NotOverridable|Object|On|Option|Optional|Or|OrElse|Overloads|Overridable|Overrides|ParamArray|Preserve|Private|Property|Protected|Public|RaiseEvent|ReadOnly|ReDim|RemoveHandler|Resume|Return|Select|Set|Shadows|Shared|Short|Single|Static|Step|Stop|String|Structure|Sub|SyncLock|Then|Throw|To|Try|TypeOf|Unicode|Until|Variant|Wend|When|While|With|WithEvents|WriteOnly|Xor|EndIf|GoSub|Let|Variant|Wend)\b/i, | |||
| null],["com",/^REM[^\r\n\u2028\u2029]*/i],["lit",/^(?:True\b|False\b|Nothing\b|\d+(?:E[+\-]?\d+[FRD]?|[FRDSIL])?|(?:&H[0-9A-F]+|&O[0-7]+)[SIL]?|\d*\.\d+(?:E[+\-]?\d+)?[FRD]?|#\s+(?:\d+[\-\/]\d+[\-\/]\d+(?:\s+\d+:\d+(?::\d+)?(\s*(?:AM|PM))?)?|\d+:\d+(?::\d+)?(\s*(?:AM|PM))?)\s+#)/i],["pln",/^(?:(?:[a-z]|_\w)\w*|\[(?:[a-z]|_\w)\w*\])/i],["pun",/^[^\w\t\n\r \"\'\[\]\xA0\u2018\u2019\u201C\u201D\u2028\u2029]+/],["pun",/^(?:\[|\])/]]),["vb","vbs"]) | |||
+ 3
- 0
docs/js/prettify/lang-vhdl.js
View File
| @ -0,0 +1,3 @@ | |||
| PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\r \xA0]+/,null,"\t\n\r \u00a0"]],[["str",/^(?:[BOX]?"(?:[^\"]|"")*"|'.')/i],["com",/^--[^\r\n]*/],["kwd",/^(?:abs|access|after|alias|all|and|architecture|array|assert|attribute|begin|block|body|buffer|bus|case|component|configuration|constant|disconnect|downto|else|elsif|end|entity|exit|file|for|function|generate|generic|group|guarded|if|impure|in|inertial|inout|is|label|library|linkage|literal|loop|map|mod|nand|new|next|nor|not|null|of|on|open|or|others|out|package|port|postponed|procedure|process|pure|range|record|register|reject|rem|report|return|rol|ror|select|severity|shared|signal|sla|sll|sra|srl|subtype|then|to|transport|type|unaffected|units|until|use|variable|wait|when|while|with|xnor|xor)(?=[^\w-]|$)/i, | |||
| null],["typ",/^(?:bit|bit_vector|character|boolean|integer|real|time|string|severity_level|positive|natural|signed|unsigned|line|text|std_u?logic(?:_vector)?)(?=[^\w-]|$)/i,null],["typ",/^\'(?:ACTIVE|ASCENDING|BASE|DELAYED|DRIVING|DRIVING_VALUE|EVENT|HIGH|IMAGE|INSTANCE_NAME|LAST_ACTIVE|LAST_EVENT|LAST_VALUE|LEFT|LEFTOF|LENGTH|LOW|PATH_NAME|POS|PRED|QUIET|RANGE|REVERSE_RANGE|RIGHT|RIGHTOF|SIMPLE_NAME|STABLE|SUCC|TRANSACTION|VAL|VALUE)(?=[^\w-]|$)/i,null],["lit",/^\d+(?:_\d+)*(?:#[\w\\.]+#(?:[+\-]?\d+(?:_\d+)*)?|(?:\.\d+(?:_\d+)*)?(?:E[+\-]?\d+(?:_\d+)*)?)/i], | |||
| ["pln",/^(?:[a-z]\w*|\\[^\\]*\\)/i],["pun",/^[^\w\t\n\r \xA0\"\'][^\w\t\n\r \xA0\-\"\']*/]]),["vhdl","vhd"]) | |||
+ 2
- 0
docs/js/prettify/lang-wiki.js
View File
| @ -0,0 +1,2 @@ | |||
| PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t \xA0a-gi-z0-9]+/,null,"\t \u00a0abcdefgijklmnopqrstuvwxyz0123456789"],["pun",/^[=*~\^\[\]]+/,null,"=*~^[]"]],[["lang-wiki.meta",/(?:^^|\r\n?|\n)(#[a-z]+)\b/],["lit",/^(?:[A-Z][a-z][a-z0-9]+[A-Z][a-z][a-zA-Z0-9]+)\b/],["lang-",/^\{\{\{([\s\S]+?)\}\}\}/],["lang-",/^`([^\r\n`]+)`/],["str",/^https?:\/\/[^\/?#\s]*(?:\/[^?#\s]*)?(?:\?[^#\s]*)?(?:#\S*)?/i],["pln",/^(?:\r\n|[\s\S])[^#=*~^A-Zh\{`\[\r\n]*/]]),["wiki"]); | |||
| PR.registerLangHandler(PR.createSimpleLexer([["kwd",/^#[a-z]+/i,null,"#"]],[]),["wiki.meta"]) | |||
+ 2
- 0
docs/js/prettify/lang-yaml.js
View File
| @ -0,0 +1,2 @@ | |||
| PR.registerLangHandler(PR.createSimpleLexer([["pun",/^[:|>?]+/,null,":|>?"],["dec",/^%(?:YAML|TAG)[^#\r\n]+/,null,"%"],["typ",/^[&]\S+/,null,"&"],["typ",/^!\S*/,null,"!"],["str",/^"(?:[^\\"]|\\.)*(?:"|$)/,null,'"'],["str",/^'(?:[^']|'')*(?:'|$)/,null,"'"],["com",/^#[^\r\n]*/,null,"#"],["pln",/^\s+/,null," \t\r\n"]],[["dec",/^(?:---|\.\.\.)(?:[\r\n]|$)/],["pun",/^-/],["kwd",/^\w+:[ \r\n]/],["pln",/^\w+/]]), | |||
| ["yaml","yml"]) | |||
+ 1
- 0
docs/js/prettify/prettify.css
View File
| @ -0,0 +1 @@ | |||
| .str{color:#080}.kwd{color:#008}.com{color:#800}.typ{color:#606}.lit{color:#066}.pun{color:#660}.pln{color:#000}.tag{color:#008}.atn{color:#606}.atv{color:#080}.dec{color:#606}pre.prettyprint{padding:2px;border:1px solid #888}ol.linenums{margin-top:0;margin-bottom:0}li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8{list-style:none}li.L1,li.L3,li.L5,li.L7,li.L9{background:#eee}@media print{.str{color:#060}.kwd{color:#006;font-weight:bold}.com{color:#600;font-style:italic}.typ{color:#404;font-weight:bold}.lit{color:#044}.pun{color:#440}.pln{color:#000}.tag{color:#006;font-weight:bold}.atn{color:#404}.atv{color:#060}} | |||
+ 33
- 0
docs/js/prettify/prettify.js
View File
| @ -0,0 +1,33 @@ | |||
| window.PR_SHOULD_USE_CONTINUATION=true;window.PR_TAB_WIDTH=8;window.PR_normalizedHtml=window.PR=window.prettyPrintOne=window.prettyPrint=void 0;window._pr_isIE6=function(){var y=navigator&&navigator.userAgent&&navigator.userAgent.match(/\bMSIE ([678])\./);y=y?+y[1]:false;window._pr_isIE6=function(){return y};return y}; | |||
| (function(){function y(b){return b.replace(L,"&").replace(M,"<").replace(N,">")}function H(b,f,i){switch(b.nodeType){case 1:var o=b.tagName.toLowerCase();f.push("<",o);var l=b.attributes,n=l.length;if(n){if(i){for(var r=[],j=n;--j>=0;)r[j]=l[j];r.sort(function(q,m){return q.name<m.name?-1:q.name===m.name?0:1});l=r}for(j=0;j<n;++j){r=l[j];r.specified&&f.push(" ",r.name.toLowerCase(),'="',r.value.replace(L,"&").replace(M,"<").replace(N,">").replace(X,"""),'"')}}f.push(">"); | |||
| for(l=b.firstChild;l;l=l.nextSibling)H(l,f,i);if(b.firstChild||!/^(?:br|link|img)$/.test(o))f.push("</",o,">");break;case 3:case 4:f.push(y(b.nodeValue));break}}function O(b){function f(c){if(c.charAt(0)!=="\\")return c.charCodeAt(0);switch(c.charAt(1)){case "b":return 8;case "t":return 9;case "n":return 10;case "v":return 11;case "f":return 12;case "r":return 13;case "u":case "x":return parseInt(c.substring(2),16)||c.charCodeAt(1);case "0":case "1":case "2":case "3":case "4":case "5":case "6":case "7":return parseInt(c.substring(1), | |||
| 8);default:return c.charCodeAt(1)}}function i(c){if(c<32)return(c<16?"\\x0":"\\x")+c.toString(16);c=String.fromCharCode(c);if(c==="\\"||c==="-"||c==="["||c==="]")c="\\"+c;return c}function o(c){var d=c.substring(1,c.length-1).match(RegExp("\\\\u[0-9A-Fa-f]{4}|\\\\x[0-9A-Fa-f]{2}|\\\\[0-3][0-7]{0,2}|\\\\[0-7]{1,2}|\\\\[\\s\\S]|-|[^-\\\\]","g"));c=[];for(var a=[],k=d[0]==="^",e=k?1:0,h=d.length;e<h;++e){var g=d[e];switch(g){case "\\B":case "\\b":case "\\D":case "\\d":case "\\S":case "\\s":case "\\W":case "\\w":c.push(g); | |||
| continue}g=f(g);var s;if(e+2<h&&"-"===d[e+1]){s=f(d[e+2]);e+=2}else s=g;a.push([g,s]);if(!(s<65||g>122)){s<65||g>90||a.push([Math.max(65,g)|32,Math.min(s,90)|32]);s<97||g>122||a.push([Math.max(97,g)&-33,Math.min(s,122)&-33])}}a.sort(function(v,w){return v[0]-w[0]||w[1]-v[1]});d=[];g=[NaN,NaN];for(e=0;e<a.length;++e){h=a[e];if(h[0]<=g[1]+1)g[1]=Math.max(g[1],h[1]);else d.push(g=h)}a=["["];k&&a.push("^");a.push.apply(a,c);for(e=0;e<d.length;++e){h=d[e];a.push(i(h[0]));if(h[1]>h[0]){h[1]+1>h[0]&&a.push("-"); | |||
| a.push(i(h[1]))}}a.push("]");return a.join("")}function l(c){for(var d=c.source.match(RegExp("(?:\\[(?:[^\\x5C\\x5D]|\\\\[\\s\\S])*\\]|\\\\u[A-Fa-f0-9]{4}|\\\\x[A-Fa-f0-9]{2}|\\\\[0-9]+|\\\\[^ux0-9]|\\(\\?[:!=]|[\\(\\)\\^]|[^\\x5B\\x5C\\(\\)\\^]+)","g")),a=d.length,k=[],e=0,h=0;e<a;++e){var g=d[e];if(g==="(")++h;else if("\\"===g.charAt(0))if((g=+g.substring(1))&&g<=h)k[g]=-1}for(e=1;e<k.length;++e)if(-1===k[e])k[e]=++n;for(h=e=0;e<a;++e){g=d[e];if(g==="("){++h;if(k[h]===undefined)d[e]="(?:"}else if("\\"=== | |||
| g.charAt(0))if((g=+g.substring(1))&&g<=h)d[e]="\\"+k[h]}for(h=e=0;e<a;++e)if("^"===d[e]&&"^"!==d[e+1])d[e]="";if(c.ignoreCase&&r)for(e=0;e<a;++e){g=d[e];c=g.charAt(0);if(g.length>=2&&c==="[")d[e]=o(g);else if(c!=="\\")d[e]=g.replace(/[a-zA-Z]/g,function(s){s=s.charCodeAt(0);return"["+String.fromCharCode(s&-33,s|32)+"]"})}return d.join("")}for(var n=0,r=false,j=false,q=0,m=b.length;q<m;++q){var t=b[q];if(t.ignoreCase)j=true;else if(/[a-z]/i.test(t.source.replace(/\\u[0-9a-f]{4}|\\x[0-9a-f]{2}|\\[^ux]/gi, | |||
| ""))){r=true;j=false;break}}var p=[];q=0;for(m=b.length;q<m;++q){t=b[q];if(t.global||t.multiline)throw Error(""+t);p.push("(?:"+l(t)+")")}return RegExp(p.join("|"),j?"gi":"g")}function Y(b){var f=0;return function(i){for(var o=null,l=0,n=0,r=i.length;n<r;++n)switch(i.charAt(n)){case "\t":o||(o=[]);o.push(i.substring(l,n));l=b-f%b;for(f+=l;l>=0;l-=16)o.push(" ".substring(0,l));l=n+1;break;case "\n":f=0;break;default:++f}if(!o)return i;o.push(i.substring(l));return o.join("")}}function I(b, | |||
| f,i,o){if(f){b={source:f,c:b};i(b);o.push.apply(o,b.d)}}function B(b,f){var i={},o;(function(){for(var r=b.concat(f),j=[],q={},m=0,t=r.length;m<t;++m){var p=r[m],c=p[3];if(c)for(var d=c.length;--d>=0;)i[c.charAt(d)]=p;p=p[1];c=""+p;if(!q.hasOwnProperty(c)){j.push(p);q[c]=null}}j.push(/[\0-\uffff]/);o=O(j)})();var l=f.length;function n(r){for(var j=r.c,q=[j,z],m=0,t=r.source.match(o)||[],p={},c=0,d=t.length;c<d;++c){var a=t[c],k=p[a],e=void 0,h;if(typeof k==="string")h=false;else{var g=i[a.charAt(0)]; | |||
| if(g){e=a.match(g[1]);k=g[0]}else{for(h=0;h<l;++h){g=f[h];if(e=a.match(g[1])){k=g[0];break}}e||(k=z)}if((h=k.length>=5&&"lang-"===k.substring(0,5))&&!(e&&typeof e[1]==="string")){h=false;k=P}h||(p[a]=k)}g=m;m+=a.length;if(h){h=e[1];var s=a.indexOf(h),v=s+h.length;if(e[2]){v=a.length-e[2].length;s=v-h.length}k=k.substring(5);I(j+g,a.substring(0,s),n,q);I(j+g+s,h,Q(k,h),q);I(j+g+v,a.substring(v),n,q)}else q.push(j+g,k)}r.d=q}return n}function x(b){var f=[],i=[];if(b.tripleQuotedStrings)f.push([A,/^(?:\'\'\'(?:[^\'\\]|\\[\s\S]|\'{1,2}(?=[^\']))*(?:\'\'\'|$)|\"\"\"(?:[^\"\\]|\\[\s\S]|\"{1,2}(?=[^\"]))*(?:\"\"\"|$)|\'(?:[^\\\']|\\[\s\S])*(?:\'|$)|\"(?:[^\\\"]|\\[\s\S])*(?:\"|$))/, | |||
| null,"'\""]);else b.multiLineStrings?f.push([A,/^(?:\'(?:[^\\\']|\\[\s\S])*(?:\'|$)|\"(?:[^\\\"]|\\[\s\S])*(?:\"|$)|\`(?:[^\\\`]|\\[\s\S])*(?:\`|$))/,null,"'\"`"]):f.push([A,/^(?:\'(?:[^\\\'\r\n]|\\.)*(?:\'|$)|\"(?:[^\\\"\r\n]|\\.)*(?:\"|$))/,null,"\"'"]);b.verbatimStrings&&i.push([A,/^@\"(?:[^\"]|\"\")*(?:\"|$)/,null]);if(b.hashComments)if(b.cStyleComments){f.push([C,/^#(?:(?:define|elif|else|endif|error|ifdef|include|ifndef|line|pragma|undef|warning)\b|[^\r\n]*)/,null,"#"]);i.push([A,/^<(?:(?:(?:\.\.\/)*|\/?)(?:[\w-]+(?:\/[\w-]+)+)?[\w-]+\.h|[a-z]\w*)>/, | |||
| null])}else f.push([C,/^#[^\r\n]*/,null,"#"]);if(b.cStyleComments){i.push([C,/^\/\/[^\r\n]*/,null]);i.push([C,/^\/\*[\s\S]*?(?:\*\/|$)/,null])}b.regexLiterals&&i.push(["lang-regex",RegExp("^"+Z+"(/(?=[^/*])(?:[^/\\x5B\\x5C]|\\x5C[\\s\\S]|\\x5B(?:[^\\x5C\\x5D]|\\x5C[\\s\\S])*(?:\\x5D|$))+/)")]);b=b.keywords.replace(/^\s+|\s+$/g,"");b.length&&i.push([R,RegExp("^(?:"+b.replace(/\s+/g,"|")+")\\b"),null]);f.push([z,/^\s+/,null," \r\n\t\u00a0"]);i.push([J,/^@[a-z_$][a-z_$@0-9]*/i,null],[S,/^@?[A-Z]+[a-z][A-Za-z_$@0-9]*/, | |||
| null],[z,/^[a-z_$][a-z_$@0-9]*/i,null],[J,/^(?:0x[a-f0-9]+|(?:\d(?:_\d+)*\d*(?:\.\d*)?|\.\d\+)(?:e[+\-]?\d+)?)[a-z]*/i,null,"0123456789"],[E,/^.[^\s\w\.$@\'\"\`\/\#]*/,null]);return B(f,i)}function $(b){function f(D){if(D>r){if(j&&j!==q){n.push("</span>");j=null}if(!j&&q){j=q;n.push('<span class="',j,'">')}var T=y(p(i.substring(r,D))).replace(e?d:c,"$1 ");e=k.test(T);n.push(T.replace(a,s));r=D}}var i=b.source,o=b.g,l=b.d,n=[],r=0,j=null,q=null,m=0,t=0,p=Y(window.PR_TAB_WIDTH),c=/([\r\n ]) /g, | |||
| d=/(^| ) /gm,a=/\r\n?|\n/g,k=/[ \r\n]$/,e=true,h=window._pr_isIE6();h=h?b.b.tagName==="PRE"?h===6?" \r\n":h===7?" <br>\r":" \r":" <br />":"<br />";var g=b.b.className.match(/\blinenums\b(?::(\d+))?/),s;if(g){for(var v=[],w=0;w<10;++w)v[w]=h+'</li><li class="L'+w+'">';var F=g[1]&&g[1].length?g[1]-1:0;n.push('<ol class="linenums"><li class="L',F%10,'"');F&&n.push(' value="',F+1,'"');n.push(">");s=function(){var D=v[++F%10];return j?"</span>"+D+'<span class="'+j+'">':D}}else s=h; | |||
| for(;;)if(m<o.length?t<l.length?o[m]<=l[t]:true:false){f(o[m]);if(j){n.push("</span>");j=null}n.push(o[m+1]);m+=2}else if(t<l.length){f(l[t]);q=l[t+1];t+=2}else break;f(i.length);j&&n.push("</span>");g&&n.push("</li></ol>");b.a=n.join("")}function u(b,f){for(var i=f.length;--i>=0;){var o=f[i];if(G.hasOwnProperty(o))"console"in window&&console.warn("cannot override language handler %s",o);else G[o]=b}}function Q(b,f){b&&G.hasOwnProperty(b)||(b=/^\s*</.test(f)?"default-markup":"default-code");return G[b]} | |||
| function U(b){var f=b.f,i=b.e;b.a=f;try{var o,l=f.match(aa);f=[];var n=0,r=[];if(l)for(var j=0,q=l.length;j<q;++j){var m=l[j];if(m.length>1&&m.charAt(0)==="<"){if(!ba.test(m))if(ca.test(m)){f.push(m.substring(9,m.length-3));n+=m.length-12}else if(da.test(m)){f.push("\n");++n}else if(m.indexOf(V)>=0&&m.replace(/\s(\w+)\s*=\s*(?:\"([^\"]*)\"|'([^\']*)'|(\S+))/g,' $1="$2$3$4"').match(/[cC][lL][aA][sS][sS]=\"[^\"]*\bnocode\b/)){var t=m.match(W)[2],p=1,c;c=j+1;a:for(;c<q;++c){var d=l[c].match(W);if(d&& | |||
| d[2]===t)if(d[1]==="/"){if(--p===0)break a}else++p}if(c<q){r.push(n,l.slice(j,c+1).join(""));j=c}else r.push(n,m)}else r.push(n,m)}else{var a;p=m;var k=p.indexOf("&");if(k<0)a=p;else{for(--k;(k=p.indexOf("&#",k+1))>=0;){var e=p.indexOf(";",k);if(e>=0){var h=p.substring(k+3,e),g=10;if(h&&h.charAt(0)==="x"){h=h.substring(1);g=16}var s=parseInt(h,g);isNaN(s)||(p=p.substring(0,k)+String.fromCharCode(s)+p.substring(e+1))}}a=p.replace(ea,"<").replace(fa,">").replace(ga,"'").replace(ha,'"').replace(ia," ").replace(ja, | |||
| "&")}f.push(a);n+=a.length}}o={source:f.join(""),h:r};var v=o.source;b.source=v;b.c=0;b.g=o.h;Q(i,v)(b);$(b)}catch(w){if("console"in window)console.log(w&&w.stack?w.stack:w)}}var A="str",R="kwd",C="com",S="typ",J="lit",E="pun",z="pln",P="src",V="nocode",Z=function(){for(var b=["!","!=","!==","#","%","%=","&","&&","&&=","&=","(","*","*=","+=",",","-=","->","/","/=",":","::",";","<","<<","<<=","<=","=","==","===",">",">=",">>",">>=",">>>",">>>=","?","@","[","^","^=","^^","^^=","{","|","|=","||","||=", | |||
| "~","break","case","continue","delete","do","else","finally","instanceof","return","throw","try","typeof"],f="(?:^^|[+-]",i=0;i<b.length;++i)f+="|"+b[i].replace(/([^=<>:&a-z])/g,"\\$1");f+=")\\s*";return f}(),L=/&/g,M=/</g,N=/>/g,X=/\"/g,ea=/</g,fa=/>/g,ga=/'/g,ha=/"/g,ja=/&/g,ia=/ /g,ka=/[\r\n]/g,K=null,aa=RegExp("[^<]+|<!--[\\s\\S]*?--\>|<!\\[CDATA\\[[\\s\\S]*?\\]\\]>|</?[a-zA-Z](?:[^>\"']|'[^']*'|\"[^\"]*\")*>|<","g"),ba=/^<\!--/,ca=/^<!\[CDATA\[/,da=/^<br\b/i,W=/^<(\/?)([a-zA-Z][a-zA-Z0-9]*)/, | |||
| la=x({keywords:"break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof alignof align_union asm axiom bool concept concept_map const_cast constexpr decltype dynamic_cast explicit export friend inline late_check mutable namespace nullptr reinterpret_cast static_assert static_cast template typeid typename using virtual wchar_t where break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof abstract boolean byte extends final finally implements import instanceof null native package strictfp super synchronized throws transient as base by checked decimal delegate descending event fixed foreach from group implicit in interface internal into is lock object out override orderby params partial readonly ref sbyte sealed stackalloc string select uint ulong unchecked unsafe ushort var break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof debugger eval export function get null set undefined var with Infinity NaN caller delete die do dump elsif eval exit foreach for goto if import last local my next no our print package redo require sub undef unless until use wantarray while BEGIN END break continue do else for if return while and as assert class def del elif except exec finally from global import in is lambda nonlocal not or pass print raise try with yield False True None break continue do else for if return while alias and begin case class def defined elsif end ensure false in module next nil not or redo rescue retry self super then true undef unless until when yield BEGIN END break continue do else for if return while case done elif esac eval fi function in local set then until ", | |||
| hashComments:true,cStyleComments:true,multiLineStrings:true,regexLiterals:true}),G={};u(la,["default-code"]);u(B([],[[z,/^[^<?]+/],["dec",/^<!\w[^>]*(?:>|$)/],[C,/^<\!--[\s\S]*?(?:-\->|$)/],["lang-",/^<\?([\s\S]+?)(?:\?>|$)/],["lang-",/^<%([\s\S]+?)(?:%>|$)/],[E,/^(?:<[%?]|[%?]>)/],["lang-",/^<xmp\b[^>]*>([\s\S]+?)<\/xmp\b[^>]*>/i],["lang-js",/^<script\b[^>]*>([\s\S]*?)(<\/script\b[^>]*>)/i],["lang-css",/^<style\b[^>]*>([\s\S]*?)(<\/style\b[^>]*>)/i],["lang-in.tag",/^(<\/?[a-z][^<>]*>)/i]]),["default-markup", | |||
| "htm","html","mxml","xhtml","xml","xsl"]);u(B([[z,/^[\s]+/,null," \t\r\n"],["atv",/^(?:\"[^\"]*\"?|\'[^\']*\'?)/,null,"\"'"]],[["tag",/^^<\/?[a-z](?:[\w.:-]*\w)?|\/?>$/i],["atn",/^(?!style[\s=]|on)[a-z](?:[\w:-]*\w)?/i],["lang-uq.val",/^=\s*([^>\'\"\s]*(?:[^>\'\"\s\/]|\/(?=\s)))/],[E,/^[=<>\/]+/],["lang-js",/^on\w+\s*=\s*\"([^\"]+)\"/i],["lang-js",/^on\w+\s*=\s*\'([^\']+)\'/i],["lang-js",/^on\w+\s*=\s*([^\"\'>\s]+)/i],["lang-css",/^style\s*=\s*\"([^\"]+)\"/i],["lang-css",/^style\s*=\s*\'([^\']+)\'/i], | |||
| ["lang-css",/^style\s*=\s*([^\"\'>\s]+)/i]]),["in.tag"]);u(B([],[["atv",/^[\s\S]+/]]),["uq.val"]);u(x({keywords:"break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof alignof align_union asm axiom bool concept concept_map const_cast constexpr decltype dynamic_cast explicit export friend inline late_check mutable namespace nullptr reinterpret_cast static_assert static_cast template typeid typename using virtual wchar_t where ", | |||
| hashComments:true,cStyleComments:true}),["c","cc","cpp","cxx","cyc","m"]);u(x({keywords:"null true false"}),["json"]);u(x({keywords:"break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof abstract boolean byte extends final finally implements import instanceof null native package strictfp super synchronized throws transient as base by checked decimal delegate descending event fixed foreach from group implicit in interface internal into is lock object out override orderby params partial readonly ref sbyte sealed stackalloc string select uint ulong unchecked unsafe ushort var ", | |||
| hashComments:true,cStyleComments:true,verbatimStrings:true}),["cs"]);u(x({keywords:"break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof abstract boolean byte extends final finally implements import instanceof null native package strictfp super synchronized throws transient ", | |||
| cStyleComments:true}),["java"]);u(x({keywords:"break continue do else for if return while case done elif esac eval fi function in local set then until ",hashComments:true,multiLineStrings:true}),["bsh","csh","sh"]);u(x({keywords:"break continue do else for if return while and as assert class def del elif except exec finally from global import in is lambda nonlocal not or pass print raise try with yield False True None ",hashComments:true,multiLineStrings:true,tripleQuotedStrings:true}),["cv","py"]); | |||
| u(x({keywords:"caller delete die do dump elsif eval exit foreach for goto if import last local my next no our print package redo require sub undef unless until use wantarray while BEGIN END ",hashComments:true,multiLineStrings:true,regexLiterals:true}),["perl","pl","pm"]);u(x({keywords:"break continue do else for if return while alias and begin case class def defined elsif end ensure false in module next nil not or redo rescue retry self super then true undef unless until when yield BEGIN END ",hashComments:true, | |||
| multiLineStrings:true,regexLiterals:true}),["rb"]);u(x({keywords:"break continue do else for if return while auto case char const default double enum extern float goto int long register short signed sizeof static struct switch typedef union unsigned void volatile catch class delete false import new operator private protected public this throw true try typeof debugger eval export function get null set undefined var with Infinity NaN ",cStyleComments:true,regexLiterals:true}),["js"]);u(B([],[[A,/^[\s\S]+/]]), | |||
| ["regex"]);window.PR_normalizedHtml=H;window.prettyPrintOne=function(b,f){var i={f:b,e:f};U(i);return i.a};window.prettyPrint=function(b){function f(){for(var t=window.PR_SHOULD_USE_CONTINUATION?j.now()+250:Infinity;q<o.length&&j.now()<t;q++){var p=o[q];if(p.className&&p.className.indexOf("prettyprint")>=0){var c=p.className.match(/\blang-(\w+)\b/);if(c)c=c[1];for(var d=false,a=p.parentNode;a;a=a.parentNode)if((a.tagName==="pre"||a.tagName==="code"||a.tagName==="xmp")&&a.className&&a.className.indexOf("prettyprint")>= | |||
| 0){d=true;break}if(!d){a=p;if(null===K){d=document.createElement("PRE");d.appendChild(document.createTextNode('<!DOCTYPE foo PUBLIC "foo bar">\n<foo />'));K=!/</.test(d.innerHTML)}if(K){d=a.innerHTML;if("XMP"===a.tagName)d=y(d);else{a=a;if("PRE"===a.tagName)a=true;else if(ka.test(d)){var k="";if(a.currentStyle)k=a.currentStyle.whiteSpace;else if(window.getComputedStyle)k=window.getComputedStyle(a,null).whiteSpace;a=!k||k==="pre"}else a=true;a||(d=d.replace(/(<br\s*\/?>)[\r\n]+/g,"$1").replace(/(?:[\r\n]+[ \t]*)+/g, | |||
| " "))}d=d}else{d=[];for(a=a.firstChild;a;a=a.nextSibling)H(a,d);d=d.join("")}d=d.replace(/(?:\r\n?|\n)$/,"");m={f:d,e:c,b:p};U(m);if(p=m.a){c=m.b;if("XMP"===c.tagName){d=document.createElement("PRE");for(a=0;a<c.attributes.length;++a){k=c.attributes[a];if(k.specified)if(k.name.toLowerCase()==="class")d.className=k.value;else d.setAttribute(k.name,k.value)}d.innerHTML=p;c.parentNode.replaceChild(d,c)}else c.innerHTML=p}}}}if(q<o.length)setTimeout(f,250);else b&&b()}for(var i=[document.getElementsByTagName("pre"), | |||
| document.getElementsByTagName("code"),document.getElementsByTagName("xmp")],o=[],l=0;l<i.length;++l)for(var n=0,r=i[l].length;n<r;++n)o.push(i[l][n]);i=null;var j=Date;j.now||(j={now:function(){return(new Date).getTime()}});var q=0,m;f()};window.PR={combinePrefixPatterns:O,createSimpleLexer:B,registerLangHandler:u,sourceDecorator:x,PR_ATTRIB_NAME:"atn",PR_ATTRIB_VALUE:"atv",PR_COMMENT:C,PR_DECLARATION:"dec",PR_KEYWORD:R,PR_LITERAL:J,PR_NOCODE:V,PR_PLAIN:z,PR_PUNCTUATION:E,PR_SOURCE:P,PR_STRING:A, | |||
| PR_TAG:"tag",PR_TYPE:S}})() | |||
+ 2
- 0
docs/js/smooth-scroll.min.js
View File
| @ -0,0 +1,2 @@ | |||
| /** smooth-scroll v5.3.3, by Chris Ferdinandi | http://github.com/cferdinandi/smooth-scroll | Licensed under MIT: http://gomakethings.com/mit/ */ | |||
| !function(e,t){"function"==typeof define&&define.amd?define("smoothScroll",t(e)):"object"==typeof exports?module.exports=t(e):e.smoothScroll=t(e)}(window||this,function(e){"use strict";var t,n,o,r={},a=!!document.querySelector&&!!e.addEventListener,c={speed:500,easing:"easeInOutCubic",offset:0,updateURL:!0,callbackBefore:function(){},callbackAfter:function(){}},u=function(e,t,n){if("[object Object]"===Object.prototype.toString.call(e))for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.call(n,e[o],o,e);else for(var r=0,a=e.length;a>r;r++)t.call(n,e[r],r,e)},i=function(e,t){var n={};return u(e,function(t,o){n[o]=e[o]}),u(t,function(e,o){n[o]=t[o]}),n},l=function(e,t){for(var n=t.charAt(0);e&&e!==document;e=e.parentNode)if("."===n){if(e.classList.contains(t.substr(1)))return e}else if("#"===n){if(e.id===t.substr(1))return e}else if("["===n&&e.hasAttribute(t.substr(1,t.length-2)))return e;return!1},s=function(e){return Math.max(e.scrollHeight,e.offsetHeight,e.clientHeight)},f=function(e){for(var t,n=String(e),o=n.length,r=-1,a="",c=n.charCodeAt(0);++r<o;){if(t=n.charCodeAt(r),0===t)throw new InvalidCharacterError("Invalid character: the input contains U+0000.");a+=t>=1&&31>=t||127==t||0===r&&t>=48&&57>=t||1===r&&t>=48&&57>=t&&45===c?"\\"+t.toString(16)+" ":t>=128||45===t||95===t||t>=48&&57>=t||t>=65&&90>=t||t>=97&&122>=t?n.charAt(r):"\\"+n.charAt(r)}return a},d=function(e,t){var n;return"easeInQuad"===e&&(n=t*t),"easeOutQuad"===e&&(n=t*(2-t)),"easeInOutQuad"===e&&(n=.5>t?2*t*t:-1+(4-2*t)*t),"easeInCubic"===e&&(n=t*t*t),"easeOutCubic"===e&&(n=--t*t*t+1),"easeInOutCubic"===e&&(n=.5>t?4*t*t*t:(t-1)*(2*t-2)*(2*t-2)+1),"easeInQuart"===e&&(n=t*t*t*t),"easeOutQuart"===e&&(n=1- --t*t*t*t),"easeInOutQuart"===e&&(n=.5>t?8*t*t*t*t:1-8*--t*t*t*t),"easeInQuint"===e&&(n=t*t*t*t*t),"easeOutQuint"===e&&(n=1+--t*t*t*t*t),"easeInOutQuint"===e&&(n=.5>t?16*t*t*t*t*t:1+16*--t*t*t*t*t),n||t},h=function(e,t,n){var o=0;if(e.offsetParent)do o+=e.offsetTop,e=e.offsetParent;while(e);return o=o-t-n,o>=0?o:0},m=function(){return Math.max(document.body.scrollHeight,document.documentElement.scrollHeight,document.body.offsetHeight,document.documentElement.offsetHeight,document.body.clientHeight,document.documentElement.clientHeight)},p=function(e){return e&&"object"==typeof JSON&&"function"==typeof JSON.parse?JSON.parse(e):{}},v=function(t,n){history.pushState&&(n||"true"===n)&&history.pushState(null,null,[e.location.protocol,"//",e.location.host,e.location.pathname,e.location.search,t].join(""))};r.animateScroll=function(t,n,r){var a=i(a||c,r||{}),u=p(t?t.getAttribute("data-options"):null);a=i(a,u),n="#"+f(n.substr(1));var l="#"===n?document.documentElement:document.querySelector(n),g=e.pageYOffset;o||(o=document.querySelector("[data-scroll-header]"));var b,O,y,S=null===o?0:s(o)+o.offsetTop,I=h(l,S,parseInt(a.offset,10)),H=I-g,E=m(),A=0;v(n,a.updateURL);var L=function(o,r,c){var u=e.pageYOffset;(o==r||u==r||e.innerHeight+u>=E)&&(clearInterval(c),l.focus(),a.callbackAfter(t,n))},Q=function(){A+=16,O=A/parseInt(a.speed,10),O=O>1?1:O,y=g+H*d(a.easing,O),e.scrollTo(0,Math.floor(y)),L(y,I,b)},C=function(){a.callbackBefore(t,n),b=setInterval(Q,16)};0===e.pageYOffset&&e.scrollTo(0,0),C()};var g=function(e){var n=l(e.target,"[data-scroll]");n&&"a"===n.tagName.toLowerCase()&&(e.preventDefault(),r.animateScroll(n,n.hash,t))},b=function(){n||(n=setTimeout(function(){n=null,headerHeight=null===o?0:s(o)+o.offsetTop},66))};return r.destroy=function(){t&&(document.removeEventListener("click",g,!1),e.removeEventListener("resize",b,!1),t=null,n=null,o=null)},r.init=function(n){a&&(r.destroy(),t=i(c,n||{}),o=document.querySelector("[data-scroll-header]"),document.addEventListener("click",g,!1),o&&e.addEventListener("resize",b,!1))},r}); | |||
+ 133
- 0
docs/network/canvas.html
View File
| @ -0,0 +1,133 @@ | |||
| <!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"> | |||
| <meta charset="utf-8"> | |||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||
| <meta name="description" content=""> | |||
| <meta name="author" content=""> | |||
| <link rel="icon" HREF="favicon.ico"> | |||
| <title>vis.js - A dynamic, browser based visualization library.</title> | |||
| <!-- Bootstrap core CSS --> | |||
| <link href="../css/bootstrap.css" rel="stylesheet"> | |||
| <link href="../css/newdocs.css" rel="stylesheet"> | |||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | |||
| <!--[if lt IE 9]> | |||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | |||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |||
| <![endif]--> | |||
| <script src="../js/smooth-scroll.min.js"></script> | |||
| <script language="JavaScript"> | |||
| smoothScroll.init(); | |||
| </script> | |||
| <style> | |||
| td.properties { | |||
| width:350px; | |||
| } | |||
| pre.code { | |||
| padding:2px 4px; | |||
| font-size:90%; | |||
| color:#c7254e; | |||
| background-color:#f9f2f4; | |||
| border-radius:4px; | |||
| border:0px; | |||
| } | |||
| </style> | |||
| </head> | |||
| <!-- 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="../index.html#modules">Modules</a></li> | |||
| <li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon" src="../images/external-link-icons/external-link-icon-white.png"></a></li> | |||
| <li><a href="../blog.html">Blog</a></li> | |||
| <li><a href="../index.html#download_install">Download</a></li> | |||
| <li><a href="../showcase/index.html">Showcase</a></li> | |||
| <li><a href="../index.html#contribute">Contribute</a></li> | |||
| <li><a href="../featureRequests.html">Feature requests</a></li> | |||
| <li><a href="../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> | |||
| <div class="container full"> | |||
| <h1>Network - canvas</h1> | |||
| <p>Handles the HTML part of the canvas.</p> | |||
| <h3>Options</h3> | |||
| <p>This is a list of all the methods in the public API. They are collected here from all individual modules.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td>type</td><td>default</td><td>description</td></tr> | |||
| <tr><td>width</td><td class="mid">String</td><td class="mid"><code>'100%'</code></td><td>the width of the canvas. Can be in percentages or pixels (ie. <code>'400px'</code>).</td></tr> | |||
| <tr><td>height</td><td class="mid">String</td><td class="mid"><code>'100%'</code></td><td>the height of the canvas. Can be in percentages or pixels (ie. <code>'400px'</code>).</td></tr> | |||
| </table> | |||
| <h3>Methods</h3> | |||
| <p>This is a list of all the methods in the public API. Options can be set directly to the module or you can use the setOptions method of the network itself and use the module name as an object name.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td>returns</td><td>description</td></tr> | |||
| <tr><td>setSize(String, String)</td><td class="mid">none</td><td>Set the size of the canvas. This is automatically done on a window resize.</td></tr> | |||
| <tr><td>canvasToDOM(Object)</td> <td class="mid">Object</td><td>This function converts canvas coordinates to coordinates on the DOM. Input and output are in the form of <code>{x:Number,y:Number}</code>. The DOM values are relative to the network container.</td></tr> | |||
| <tr><td>DOMtoCanvas(Object)</td> <td class="mid">Object</td><td>This function converts DOM coordinates to coordinates on the canvas. Input and output are in the form of <code>{x:Number,y:Number}</code>. The DOM values are relative to the network container.</td></tr> | |||
| </table> | |||
| <h3>Events</h3> | |||
| <p>This is a list of all the events in the public API. They are collected here from all individual modules.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td class="properties">properties</td><td>description</td></tr> | |||
| <tr><td>resize</td><td class="mid"> | |||
| <pre class="code"> | |||
| { | |||
| width: Number // the new width of the canvas | |||
| height: Number // the new height of the canvas | |||
| oldWidth: Number // the old width of the canvas | |||
| oldHeight: Number // the old height of the canvas | |||
| } | |||
| </pre><ul> | |||
| </ul></td><td>Fired when the size of the canvas has been resized, either by a redraw call when the container div has changed in size, a setSize() call with new values or a setOptions() with new width and/or height values.</td> | |||
| </tr> | |||
| </table> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| </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> | |||
+ 144
- 0
docs/network/clustering.html
View File
| @ -0,0 +1,144 @@ | |||
| <!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"> | |||
| <meta charset="utf-8"> | |||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||
| <meta name="description" content=""> | |||
| <meta name="author" content=""> | |||
| <link rel="icon" HREF="favicon.ico"> | |||
| <title>vis.js - A dynamic, browser based visualization library.</title> | |||
| <!-- Bootstrap core CSS --> | |||
| <link href="../css/bootstrap.css" rel="stylesheet"> | |||
| <link href="../css/newdocs.css" rel="stylesheet"> | |||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | |||
| <!--[if lt IE 9]> | |||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | |||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |||
| <![endif]--> | |||
| <script src="../js/smooth-scroll.min.js"></script> | |||
| <script language="JavaScript"> | |||
| smoothScroll.init(); | |||
| </script> | |||
| <style> | |||
| td.properties { | |||
| width:350px; | |||
| } | |||
| pre.code { | |||
| padding:2px 4px; | |||
| font-size:90%; | |||
| color:#c7254e; | |||
| background-color:#f9f2f4; | |||
| border-radius:4px; | |||
| border:0px; | |||
| } | |||
| td.type { | |||
| width:150px; | |||
| } | |||
| tr.hidden{ | |||
| dislpay:none; | |||
| } | |||
| </style> | |||
| </head> | |||
| <!-- 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="../index.html#modules">Modules</a></li> | |||
| <li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon" src="../images/external-link-icons/external-link-icon-white.png"></a></li> | |||
| <li><a href="../blog.html">Blog</a></li> | |||
| <li><a href="../index.html#download_install">Download</a></li> | |||
| <li><a href="../showcase/index.html">Showcase</a></li> | |||
| <li><a href="../index.html#contribute">Contribute</a></li> | |||
| <li><a href="../featureRequests.html">Feature requests</a></li> | |||
| <li><a href="../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> | |||
| <div class="container full"> | |||
| <h1>Network - clustering</h1> | |||
| <p>Handles the HTML part of the canvas.</p> | |||
| <h3>Options</h3> | |||
| <p>Clustering has no options, everything is done with methods.</p> | |||
| <h3>Methods</h3> | |||
| <p>This is a list of all the methods in the public API. Options can be set directly to the module or you can use the setOptions method of the network itself and use the module name as an object name.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td>returns</td><td>description</td></tr> | |||
| <tr><td>isCluster()</td> <td class="mid">none</td><td></td></td></tr> | |||
| <tr><td>openCluster()</td> <td class="mid">none</td><td></td></tr> | |||
| <tr><td>clusterByConnection()</td> <td class="mid">none</td><td></td></tr> | |||
| <tr><td>clusterByConnectionCount()</td> <td class="mid">none</td><td></td></tr> | |||
| <tr><td>clusterByNodeData()</td> <td class="mid">none</td><td></td></tr> | |||
| <tr><td>clusterOutliers()</td> <td class="mid">none</td><td></td></tr> | |||
| </table> | |||
| <h3>Events</h3> | |||
| <p>This is a list of all the events in the public API. They are collected here from all individual modules.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td class="properties">properties</td><td>description</td></tr> | |||
| <tr><td>startStabilizing</td><td class="mid">none</td><td>Fired when stabilization starts. This is also the case when you drag a node and the physics simulation restarts to stabilize again. Stabilization does not neccesarily imply 'without showing'.</td> | |||
| <tr><td>stabilizationProgress</td><td class="mid"> | |||
| <pre class="code"> | |||
| { | |||
| iterations: Number // iterations so far, | |||
| total: Number // total iterations in options | |||
| } | |||
| </pre></td><td>Fired when a multiple of the <code>updateInterval</code> number of iterations is reached. This only occurs in the 'hidden' stabilization.</td></tr> | |||
| <tr><td>stabilizationIterationsDone</td><td class="mid">none</td><td>Fired when the 'hidden' stabilization finishes. This does not necessarily mean the network is stabilized; it could also mean that the amount of iterations defined in the options has been reached.</td> | |||
| <tr><td>stabilized</td><td class="mid"> | |||
| <pre class="code"> | |||
| { | |||
| iterations: Number // iterations it took | |||
| } | |||
| </pre> | |||
| </td><td>Fired when the network has stabilized or when the <code>stopSimulation()</code> has been called. The amount of iterations it took could be used to tweak the maximum amount of iterations needed to stabilize the network.</td> | |||
| </table> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| </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> | |||
+ 103
- 0
docs/network/configure.html
View File
| @ -0,0 +1,103 @@ | |||
| <!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"> | |||
| <meta charset="utf-8"> | |||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||
| <meta name="description" content=""> | |||
| <meta name="author" content=""> | |||
| <link rel="icon" HREF="favicon.ico"> | |||
| <title>vis.js - A dynamic, browser based visualization library.</title> | |||
| <!-- Bootstrap core CSS --> | |||
| <link href="../css/bootstrap.css" rel="stylesheet"> | |||
| <link href="../css/newdocs.css" rel="stylesheet"> | |||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | |||
| <!--[if lt IE 9]> | |||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | |||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |||
| <![endif]--> | |||
| <script src="../js/smooth-scroll.min.js"></script> | |||
| <script language="JavaScript"> | |||
| smoothScroll.init(); | |||
| </script> | |||
| <style> | |||
| td.properties { | |||
| width:350px; | |||
| } | |||
| </style> | |||
| </head> | |||
| <!-- 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="../index.html#modules">Modules</a></li> | |||
| <li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon" src="../images/external-link-icons/external-link-icon-white.png"></a></li> | |||
| <li><a href="../blog.html">Blog</a></li> | |||
| <li><a href="../index.html#download_install">Download</a></li> | |||
| <li><a href="../showcase/index.html">Showcase</a></li> | |||
| <li><a href="../index.html#contribute">Contribute</a></li> | |||
| <li><a href="../featureRequests.html">Feature requests</a></li> | |||
| <li><a href="../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> | |||
| <div class="container full"> | |||
| <h1>Network - configure</h1> | |||
| <p>Handles the HTML part of the canvas.</p> | |||
| <h3>Options</h3> | |||
| <p>Alternative to supplying an object, you can supply a <code>String</code>, <code>Array</code> or <code>Boolean</code>. These will do the same as the filter option described below.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"> <td>name</td><td>type</td><td>default</td><td>description</td></tr> | |||
| <tr><td>filter</td> <td class="mid">String | Array | Boolean</td> <td class="mid"><code>true</code></td><td>When a boolean, true gives you all options, false will not show any. If a string is supplied, any combination of the following is allowed: nodes, edges, layout, interaction, manipulation, physics, selection, renderer. Feel free to come up with a fun seperating character. Finally, when supplied an array of strings, any of the previously mentioned fields are accepted.</td></tr> | |||
| <tr><td>container</td> <td class="mid">DOM element</td> <td class="mid"><code>undefined</code></td><td>This allows you to put the configure list in another HTML container than below the network.</td></tr> | |||
| </table> | |||
| <h3>Methods</h3> | |||
| <p>The configure module has no methods.</p> | |||
| <h3>Events</h3> | |||
| <p>The configure module has no Events.</p> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| </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> | |||
+ 177
- 0
docs/network/edges.html
View File
| @ -0,0 +1,177 @@ | |||
| <!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"> | |||
| <meta charset="utf-8"> | |||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||
| <meta name="description" content=""> | |||
| <meta name="author" content=""> | |||
| <link rel="icon" HREF="favicon.ico"> | |||
| <title>vis.js - A dynamic, browser based visualization library.</title> | |||
| <!-- Bootstrap core CSS --> | |||
| <link href="../css/bootstrap.css" rel="stylesheet"> | |||
| <link href="../css/newdocs.css" rel="stylesheet"> | |||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | |||
| <!--[if lt IE 9]> | |||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | |||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |||
| <![endif]--> | |||
| <script src="../js/smooth-scroll.min.js"></script> | |||
| <script language="JavaScript"> | |||
| smoothScroll.init(); | |||
| </script> | |||
| <style> | |||
| td.type { | |||
| width:160px; | |||
| } | |||
| </style> | |||
| </head> | |||
| <!-- 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="../index.html#modules">Modules</a></li> | |||
| <li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon" src="../images/external-link-icons/external-link-icon-white.png"></a></li> | |||
| <li><a href="../blog.html">Blog</a></li> | |||
| <li><a href="../index.html#download_install">Download</a></li> | |||
| <li><a href="../showcase/index.html">Showcase</a></li> | |||
| <li><a href="../index.html#contribute">Contribute</a></li> | |||
| <li><a href="../featureRequests.html">Feature requests</a></li> | |||
| <li><a href="../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> | |||
| <div class="container full"> | |||
| <h1>Network - edges</h1> | |||
| <p>Handles the creation and deletion of edges and contains the global edge options and styles.</p> | |||
| <h3>Options</h3> | |||
| <p>This is a list of all the methods in the public API. They are collected here from all individual modules.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td> <td class="type">type</td> <td>default</td> <td>description</td></tr> | |||
| <tr><td>arrows</td> <td class="mid">Object | String</td> <td class="mid"><code>1</code></td> <td>To draw an arrow with default settings a string can be supplied. For example: <code>arrows:'to, from, middle'</code> or <code>'to;from'</code>, any combination with any seperating symbol is fine. If you want to control the size of the arrowheads, you can supply an object.</td></tr> | |||
| <tr><td>arrows.to</td> <td class="mid">Object | Boolean</td> <td class="mid"><code>Object</code></td> <td>When true, an arrowhead on the 'to' side of the edge is drawn, pointing to the 'to' node with default settings. To customize the size of the arrow, supply an object.</td></tr> | |||
| <tr><td>arrows.to.enabled</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>Toggle the arrow on or off. This option is optional, if undefined and the scaleFactor property is set, enabled will be set to true.</td></tr> | |||
| <tr><td>arrows.to.scaleFactor</td> <td class="mid">Number</td> <td class="mid"><code>1</code></td> <td>The scale factor allows you to change the size of the arrowhead.</td></tr> | |||
| <tr><td>arrows.middle</td> <td class="mid">Object | Boolean</td> <td class="mid"><code>Object</code></td> <td>Exactly the same as the to object but with an arrowhead in the center of the edge.</td></tr> | |||
| <tr><td>arrows.from</td> <td class="mid">Object | Boolean</td> <td class="mid"><code>Object</code></td> <td>Exactly the same as the to object but with an arrowhead at the from node of the edge.</td></tr> | |||
| <tr><td>color</td> <td class="mid">Object | String</td> <td class="mid"><code>Object</code></td> <td>The color object contains the color information of the edge in every situation. When the edge only needs a single color, a color value like <code>'rgb(120,32,14)'</code>, <code>'#ffffff'</code> or <code>'red'</code> can be supplied instead of an object.</td></tr> | |||
| <tr><td>color.color</td> <td class="mid">String</td> <td class="mid"><code>'#848484'</code></td><td>The color of the border of the node when it is not selected or hovered over <i>(assuming hover is enabled in the interaction module)</i>.</td></tr> | |||
| <tr><td>color.highlight</td> <td class="mid">String</td> <td class="mid"><code>'#848484'</code></td><td>The color the edge when it is selected.</td></tr> | |||
| <tr><td>color.hover</td> <td class="mid">String</td> <td class="mid"><code>'#848484'</code></td><td>The color the edge when the mouse hovers over it <i>(assuming hover is enabled in the interaction module)</i>.</td></tr> | |||
| <tr><td>color.inherit</td> <td class="mid">String | Boolean</td> <td class="mid"><code>'from'</code></td> <td><i>When color, highlight or hover are defined, inherit is set to false!</i> | |||
| <br><br>Supported options are: <code>true, false, 'from','to','both'</code>. | |||
| <br><br>The default value is 'from' which does the same as true: the edge will inherit the color from the border of the node on the 'from' side. | |||
| <br><br>When set to 'to', the border color from the 'to' node will be used. | |||
| <br><br>When set to 'both', the color will fade from the from color to the to color. <b>'both' is computationally intensive</b> because the gradient is recomputed every redraw. This is required because the angles change when the nodes move.</td></tr> | |||
| <tr><td>color.opacity</td> <td class="mid">Number</td> <td class="mid"><code>1.0</code></td> <td>It can be useful to set the opacity of an edge without manually changing all the colors. The opacity option will convert all colors (also when using inherit) to adhere to the supplied opacity. The allowed range of the opacity option is between <code>0 and 1</code>. This is only done once so the performance impact is not too big.</td></tr> | |||
| <tr><td>dashes</td> <td class="mid">Object | Boolean</td> <td class="mid"><code>Object</code></td> <td>When true, the edge will be drawn as a dashed line. You can customize the dashes by supplying an object. <i>When using dashed lines in IE versions older than 11, the line will be drawn straight, not smooth</i>.</td></tr> | |||
| <tr><td>dashes.enabled</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>Toggle the dash drawing style on or off. This option is optional, if undefined and the scaleFactor property is set, enabled will be set to true.</td></tr> | |||
| <tr><td>dashes.pattern</td> <td class="mid">Array</td> <td class="mid"><code>[5,5]</code></td> <td>Array of numbers repeating gap length, dash length, gap length, dash length, ... etc. The array is repeated until the distance is filled.</td></tr> | |||
| <tr><td>font</td> <td class="mid">Object | String</td> <td class="mid"><code>false</code></td> <td>This object defines the details of the label. A shorthand is also supported in the form <code>'size face color'</code> for example: <code>'14px arial red'</code>.</td></tr> | |||
| <tr><td>font.color</td> <td class="mid">String</td> <td class="mid"><code>'#343434'</code></td><td>Color of the label text.</td></tr> | |||
| <tr><td>font.size</td> <td class="mid">Number</td> <td class="mid"><code>14</code></td> <td>Size of the label text.</td></tr> | |||
| <tr><td>font.face</td> <td class="mid">String</td> <td class="mid"><code>'arial'</code></td> <td>Font face (or font family) of the label text.</td></tr> | |||
| <tr><td>font.background</td> <td class="mid">String</td> <td class="mid"><code>undefined</code></td><td>When not <code>undefined</code> but a <b>color string</b>, a background rectangle will be drawn behind the label in the supplied color.</td></tr> | |||
| <tr><td>font.stroke</td> <td class="mid">Number</td> <td class="mid"><code>0</code></td> <td>As an alternative to the background rectangle, a stroke can be drawn around the text. When a value higher than 0 is supplied, the stroke will be drawn.</td></tr> | |||
| <tr><td>font.strokeColor</td> <td class="mid">String</td> <td class="mid"><code>'#ffffff'</code></td><td>This is the color of the stroke <i>assuming the value for stroke is higher than 0</i>.</td></tr> | |||
| <tr><td>font.align</td> <td class="mid">String</td> <td class="mid"><code>'horizontal'</code></td><td>Possible options: <code>'horizontal','top','middle','bottom'</code>. The alignment determines how the label is aligned over the edge. The default value <code>horizontal</code> aligns the label horizontally, regardless of the orientation of the edge. When an option other than <code>horizontal</code> is chosen, the label will align itself according to the edge. </td></tr> | |||
| <tr><td>hidden</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>When true, the edge is not drawn. It is part still part of the physics simulation however!</td></tr> | |||
| <tr><td>hoverWidth</td> <td class="mid">Number</td> <td class="mid"><code>1.5</code></td> <td>The width of the edge when the mouse hovers over it (and hover is enabled in the interaction module!)</td></tr> | |||
| <tr><td>label</td> <td class="mid">String</td> <td class="mid"><code>undefined</code></td><td>The label of the edge. HTML does not work in here because the network uses HTML5 Canvas.</td></tr> | |||
| <tr><td>length</td> <td class="mid">Number</td> <td class="mid"><code>undefined</code></td><td>The physics simulation gives edges a spring length. This value can override the length of the spring in rest.</td></tr> | |||
| <tr><td>physics</td> <td class="mid">Boolean</td> <td class="mid"><code>true</code></td> <td>When true, the edge is part of the physics simulation. When false, it will not act as a spring.</td></tr> | |||
| <tr><td>scaling</td> <td class="mid">Object</td> <td class="mid"><code>Object</code></td> <td>If the <code>value</code> option is specified, the width of the edges will be scaled according to the properties in this object. Keep in mind that when using scaling, the <code>width</code> option is neglected.</td></tr> | |||
| <tr><td>scaling.min</td> <td class="mid">Number</td> <td class="mid"><code>1</code></td> <td>If edges have a value, their widths are determined by the value, the scaling function and the min max values. The min value is the minimum allowed value.</td></tr> | |||
| <tr><td>scaling.max</td> <td class="mid">Number</td> <td class="mid"><code>15</code></td> <td>This is the maximum allowed width when the edges are scaled using the value option.</td></tr> | |||
| <tr><td>scaling.label</td> <td class="mid">Object | Boolean</td><td class="mid"><code>Object</code></td> <td>When false, the label is not allowed to scale with the edge. If true it will scale using default settigns. For further customization, you can supply an object.</td></tr> | |||
| <tr><td>scaling.label.enabled</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>Toggle the scaling of the label on or off. If this option is not defined, it is set to true if any of the properties in this object are defined.</td></tr> | |||
| <tr><td>scaling.label.min</td> <td class="mid">Number</td> <td class="mid"><code>14</code></td> <td>The minimum font-size used for labels when scaling.</td></tr> | |||
| <tr><td>scaling.label.max</td> <td class="mid">Number</td> <td class="mid"><code>30</code></td> <td>The maximum font-size used for labels when scaling.</td></tr> | |||
| <tr><td>scaling.label.maxVisible</td><td class="mid">Number</td> <td class="mid"><code>30</code></td> <td>When zooming in, the font is drawn larger as well. You can limit the perceived font size using this option. If set to 30, the font will never look larger than size 30 zoomed at 100%.</td></tr> | |||
| <tr><td>scaling.label.drawThreshold</td><td class="mid">Number</td> <td class="mid"><code>3</code></td> <td>When zooming out, the font will be drawn smaller. This defines a lower limit for when the font is drawn. When using font scaling, you can use this together with the maxVisible to first show labels of important edges when zoomed out and only show the rest when zooming in.</td></tr> | |||
| <tr><td>scaling.customScalingFunction</td> <td class="mid">Function</td><td class="mid">in description</td> <td>If edges have <code>value</code> fields, this function determines how the size of the nodes are scaled based on their values. The default function is: | |||
| <pre> | |||
| function (min,max,total,value) { | |||
| if (max === min) { | |||
| return 0.5; | |||
| } | |||
| else { | |||
| var scale = 1 / (max - min); | |||
| return Math.max(0,(value - min)*scale); | |||
| } | |||
| } | |||
| </pre> | |||
| The function receives the minimum value of the set, the maximum value, the total sum of all values and finally the value of the node or edge it works on. <b>It has to return a value between 0 and 1.</b> The nodes and edges then calculate their size as follows: | |||
| <pre> | |||
| var scale = customScalingFunction(min,max,total,value); | |||
| var diff = maxWidth - minWidth; | |||
| myWidth = minWidth + diff * scale; | |||
| </pre> | |||
| </td></tr> | |||
| <tr><td>selfReferenceSize</td> <td class="mid">Number</td> <td class="mid"><code>false</code></td> <td>When the to and from nodes are the same, a circle is drawn. This is the radius of that circle.</td></tr> | |||
| <tr><td>shadow</td> <td class="mid">Object | Boolean</td> <td class="mid"><code>Object</code></td><td>When true, the edge casts a shadow using the default settings. This can be further refined by supplying an object.</td></tr> | |||
| <tr><td>shadow.enabled</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>Toggle the casting of shadows. If this option is not defined, it is set to true if any of the properties in this object are defined.</td></tr> | |||
| <tr><td>shadow.size</td> <td class="mid">Number</td> <td class="mid"><code>10</code></td> <td>The blur size of the shadow.</td></tr> | |||
| <tr><td>shadow.x</td> <td class="mid">Number</td> <td class="mid"><code>5</code></td> <td>The x offset.</td></tr> | |||
| <tr><td>shadow.y</td> <td class="mid">Number</td> <td class="mid"><code>5</code></td> <td>The y offset.</td></tr> | |||
| <tr><td>smooth</td> <td class="mid">Object | Boolean</td> <td class="mid"><code>Object</code></td><td>When true, the edge is drawn as a quadratic bezier curve. The drawing of these curves takes longer than that of straight curves but it looks better. | |||
| There is a difference between dynamic smooth curves and static smooth curves. The dynamic smooth curves have an invisible support node that takes part in the physics simulation. If you have a lot of edges, you may want to consider turning off dynamic smooth curves for performance.</td></tr> | |||
| <tr><td>smooth.enabled</td> <td class="mid">Boolean</td> <td class="mid"><code>true</code></td> <td>Toggle smooth curves on and off. This is an optional option. If any of the other properties in this object are set, this option will be set to true.</td></tr> | |||
| <tr><td>smooth.dynamic</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>When true, the edges will have an invisible support node guiding the shape. This node is part of the physics simulation. When false, there are a number of different approximations for smooth curves. Those can be selected in the type property.</td></tr> | |||
| <tr><td>smooth.type</td> <td class="mid">String</td> <td class="mid"><code>'continuous'</code></td> <td>Possible options: <code>'continuous', 'discrete', 'diagonalCross', 'straightCross', 'horizontal', 'vertical', 'curvedCW', 'curvedCCW'</code>. Take a look at our example 26 to see what these look like and pick the one that you like best! <i>These do not do anything for dynamic smooth curves</i>.</td></tr> | |||
| <tr><td>smooth.roundness</td> <td class="mid">Number</td> <td class="mid"><code>0.5</code></td> <td>Accepted range: <code>0 .. 1.0</code>. This parameter tweaks the roundness of the static smooth curves.</td></tr> | |||
| <tr><td>title</td> <td class="mid">String</td> <td class="mid"><code>undefined</code></td> <td>The title is shown in a pop-up when the mouse moves over the edge.</td></tr> | |||
| <tr><td>width</td> <td class="mid">Number</td> <td class="mid"><code>1</code></td> <td>The width of the edge. If value is set, this is not used.</td></tr> | |||
| <tr><td>widthSelectionMultiplier</td><td class="mid">Number</td> <td class="mid"><code>2</code></td> <td>When you select the edge, the width will be the normal width * widthSelectionMultiplier.</td></tr> | |||
| <tr><td>value</td> <td class="mid">Number</td> <td class="mid"><code>undefined</code></td> <td>When a value is set, the edges' width will be scaled using the options in the scaling object defined above.</td></tr> | |||
| </table> | |||
| <h3>Methods</h3> | |||
| <p>The nodes module has no methods.</p> | |||
| <h3>Events</h3> | |||
| <p>The nodes module emits no events. Click and select events are emitted from the interaction and selection modules.</p> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| </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> | |||
+ 162
- 0
docs/network/interaction.html
View File
| @ -0,0 +1,162 @@ | |||
| <!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"> | |||
| <meta charset="utf-8"> | |||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||
| <meta name="description" content=""> | |||
| <meta name="author" content=""> | |||
| <link rel="icon" HREF="favicon.ico"> | |||
| <title>vis.js - A dynamic, browser based visualization library.</title> | |||
| <!-- Bootstrap core CSS --> | |||
| <link href="../css/bootstrap.css" rel="stylesheet"> | |||
| <link href="../css/newdocs.css" rel="stylesheet"> | |||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | |||
| <!--[if lt IE 9]> | |||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | |||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |||
| <![endif]--> | |||
| <script src="../js/smooth-scroll.min.js"></script> | |||
| <script language="JavaScript"> | |||
| smoothScroll.init(); | |||
| </script> | |||
| <style> | |||
| td.properties { | |||
| width:350px; | |||
| } | |||
| pre.code { | |||
| padding:2px 4px; | |||
| font-size:90%; | |||
| color:#c7254e; | |||
| background-color:#f9f2f4; | |||
| border-radius:4px; | |||
| border:0px; | |||
| } | |||
| </style> | |||
| </head> | |||
| <!-- 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="../index.html#modules">Modules</a></li> | |||
| <li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon" src="../images/external-link-icons/external-link-icon-white.png"></a></li> | |||
| <li><a href="../blog.html">Blog</a></li> | |||
| <li><a href="../index.html#download_install">Download</a></li> | |||
| <li><a href="../showcase/index.html">Showcase</a></li> | |||
| <li><a href="../index.html#contribute">Contribute</a></li> | |||
| <li><a href="../featureRequests.html">Feature requests</a></li> | |||
| <li><a href="../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> | |||
| <div class="container full"> | |||
| <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> | |||
| <h3>Options</h3> | |||
| <p>This is a list of all the methods in the public API. They are collected here from all individual modules.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td> <td>type</td> <td>default</td> <td>description</td></tr> | |||
| <tr><td>dragNodes</td> <td class="mid">Boolean</td> <td class="mid"><code>true</code></td> <td>When true, the nodes that are not fixed can be dragged by the user.</td></tr> | |||
| <tr><td>dragView</td> <td class="mid">Boolean</td> <td class="mid"><code>true</code></td> <td>When true, the view can be dragged around by the user.</td></tr> | |||
| <tr><td>zoomView</td> <td class="mid">Boolean</td> <td class="mid"><code>true</code></td> <td>When true, the user can zoom in.</td></tr> | |||
| <tr><td>hoverEnabled</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>When true, the nodes use their hover colors when the mouse moves over them.</td></tr> | |||
| <tr><td>navigationButtons</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>When true, navigation buttons are drawn on the network canvas. These are HTML buttons and can be completely customized using CSS.</td></tr> | |||
| <tr><td>tooltipDelay</td> <td class="mid">Object</td> <td class="mid"><code>Object</code></td> <td>When nodes or edges have a defined <code>'title'</code> field, this can be shown as a pop-up tooltip. The tooltip itself is an HTML element that can be fully styled using CSS. The delay is the amount of time in milliseconds it takes before the tooltip is shown.</td></tr> | |||
| <tr><td>keyboard</td> <td class="mid">Object | Boolean</td> <td class="mid"><code>Object</code></td> <td>When true, the keyboard shortcuts are enabled with the default settings. For further customization, you can supply an object.</td></tr> | |||
| <tr><td>keyboard.enabled</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>Toggle the usage of the keyboard shortcuts. If this option is not defined, it is set to true if any of the properties in this object are defined.</td></tr> | |||
| <tr><td>keyboard.speed.x</td> <td class="mid">Number</td> <td class="mid"><code>1</code></td> <td>The speed at which the view moves in the x direction on pressing a key or pressing a navigation button.</td></tr> | |||
| <tr><td>keyboard.speed.y</td> <td class="mid">Number</td> <td class="mid"><code>1</code></td> <td>The speed at which the view moves in the y direction on pressing a key or pressing a navigation button.</td></tr> | |||
| <tr><td>keyboard.speed.zoom</td> <td class="mid">Number</td> <td class="mid"><code>0.02</code></td> <td>The speed at which the view zooms in or out pressing a key or pressing a navigation button.</td></tr> | |||
| <tr><td>keyboard.bindToWindow</td> <td class="mid">Boolean</td> <td class="mid"><code>true</code></td> <td>When binding the keyboard shortcuts to the window, they will work regardless of which DOM object has the focus. If you have multiple networks on your page, you could set this to false, making sure the keyboard shortcuts only work on the network that has the focus.</td></tr> | |||
| </table> | |||
| <h3>Methods</h3> | |||
| <p>The interaction module has no methods.</p> | |||
| <h3>Events</h3> | |||
| <p>These events are fired by the interaction module. They are related to user input.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td class="properties">properties</td><td>description</td></tr> | |||
| <tr><td>click</td> <td class="mid"> | |||
| <pre class="code"> | |||
| { | |||
| nodes: [Array of selected nodeIds], | |||
| edges: [Array of selected edgeIds], | |||
| pointer: { | |||
| DOM: {x:pointer_x, y:pointer_y}, | |||
| canvas: {x:canvas_x, y:canvas_y} | |||
| } | |||
| } | |||
| </pre> | |||
| </td><td>Fired when the user clicks the mouse or taps on a touchscreen device.</td></tr> | |||
| <tr><td>doubleClick</td> <td class="mid">same as <code>click</code>.</td><td>Fired when the user double clicks the mouse or double taps on a touchscreen device. Since a double click is in fact 2 clicks, 2 click events are fired, followed by a double click event. If you do not want to use the click events if a double click event is fired, just check the time between click events before processing them.</td></tr> | |||
| <tr><td>hold</td> <td class="mid">same as <code>click</code>.</td><td>Fired when the user clicks and holds the mouse or taps and holds on a touchscreen device. A click event is also fired in this case.</td></tr> | |||
| <tr><td>release</td> <td class="mid">same as <code>click</code>.</td><td>Fired after drawing on the canvas has been completed. Can be used to draw on top of the network.</td></tr> | |||
| <tr><td>select</td> <td class="mid">same as <code>click</code>.</td><td>Fired when the selection has changed by user action. This means a node or edge has been selected, added to the selection or deselected. <b>All select events are only triggerd on click and hold</b>.</td></tr> | |||
| <tr><td>selectNode</td> <td class="mid">same as <code>click</code>.</td><td>Fired when a node has been selected by the user.</td></tr> | |||
| <tr><td>selectEdge</td> <td class="mid">same as <code>click</code>.</td><td>Fired when a edge has been selected by the user.</td></tr> | |||
| <tr><td>deselectNode</td><td class="mid"><pre class="code"> | |||
| { | |||
| nodes: [Array of selected nodeIds], | |||
| edges: [Array of selected edgeIds], | |||
| pointer: { | |||
| DOM: {x:pointer_x, y:pointer_y}, | |||
| canvas: {x:canvas_x, y:canvas_y} | |||
| } | |||
| }, | |||
| previousSelection: { | |||
| nodes: [Array of previously selected nodeIds], | |||
| edges: [Array of previously selected edgeIds] | |||
| } | |||
| } | |||
| </pre></td><td>Fired when a node (or nodes) has (or have) been deselected by the user. The previous selection is the list of nodes and edges that were selected before the last user event.</td></tr> | |||
| <tr><td>deselectEdge</td><td class="mid">same as <code>deselectNode</code>.</td><td>Fired when a edge (or edges) has (or have) been deselected by the user. The previous selection is the list of nodes and edges that were selected before the last user event.</td></tr> | |||
| <tr><td>dragStart</td> <td class="mid">same as <code>click</code>.</td><td>Fired when starting a drag.</td></tr> | |||
| <tr><td>dragEnd</td> <td class="mid">same as <code>click</code>.</td><td>Fired when the drag has finished.</td></tr> | |||
| <tr><td>zoom</td> <td class="mid"><code>{direction:'+'/'-'}</code></td><td>Fired when the user zooms in or out. The properties tell you which direction the zoom is in.</td></tr> | |||
| </table> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| </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> | |||
+ 125
- 0
docs/network/layout.html
View File
| @ -0,0 +1,125 @@ | |||
| <!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"> | |||
| <meta charset="utf-8"> | |||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||
| <meta name="description" content=""> | |||
| <meta name="author" content=""> | |||
| <link rel="icon" HREF="favicon.ico"> | |||
| <title>vis.js - A dynamic, browser based visualization library.</title> | |||
| <!-- Bootstrap core CSS --> | |||
| <link href="../css/bootstrap.css" rel="stylesheet"> | |||
| <link href="../css/newdocs.css" rel="stylesheet"> | |||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | |||
| <!--[if lt IE 9]> | |||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | |||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |||
| <![endif]--> | |||
| <script src="../js/smooth-scroll.min.js"></script> | |||
| <script language="JavaScript"> | |||
| smoothScroll.init(); | |||
| </script> | |||
| <style> | |||
| pre.code { | |||
| padding:2px 4px; | |||
| font-size:90%; | |||
| color:#c7254e; | |||
| background-color:#f9f2f4; | |||
| border-radius:4px; | |||
| border:0px; | |||
| } | |||
| td.method { | |||
| width:250px; | |||
| } | |||
| p { | |||
| max-width:1000px; | |||
| } | |||
| </style> | |||
| </head> | |||
| <!-- 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="../index.html#modules">Modules</a></li> | |||
| <li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon" src="../images/external-link-icons/external-link-icon-white.png"></a></li> | |||
| <li><a href="../blog.html">Blog</a></li> | |||
| <li><a href="../index.html#download_install">Download</a></li> | |||
| <li><a href="../showcase/index.html">Showcase</a></li> | |||
| <li><a href="../index.html#contribute">Contribute</a></li> | |||
| <li><a href="../featureRequests.html">Feature requests</a></li> | |||
| <li><a href="../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> | |||
| <div class="container full"> | |||
| <h1>Network - layout</h1> | |||
| <p>Acts as the camera that looks on the canvas. Does the animation, zooming and focusing.</p> | |||
| <h3>Options</h3> | |||
| <p>When enabling the hierarchical layout, it overrules some of the other options. The physics is set to the hierarchical repulsion solver and dynamic smooth edges are converted to static smooth edges.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td>type</td><td>default</td><td>description</td></tr> | |||
| <tr><td>randomSeed</td><td class="mid">Number</td><td class="mid"><code>undefined</code></td> <td>When NOT using the hierarchical layout, the nodes are randomly positioned initially. This means that the settled result is different every time. If you provide a random seed manually, the layout will be the same every time. Ideally you try with an undefined seed, reload until you are happy with the layout and use the <code>getSeed()</code> method to ascertain the seed.</td></tr> | |||
| <tr><td>hierarchical</td><td class="mid">Object | Boolean</td><td class="mid"><code>Object</code></td> <td>When true, the layout engine positions the nodes in a hierarchical fashion using default settings. For customization you can supply an object.</td></tr> | |||
| <tr><td>hierarchical.enabled</td><td class="mid">Boolean</td><td class="mid"><code>false</code></td> <td>Toggle the usage of the hierarchical layout system. If this option is not defined, it is set to true if any of the properties in this object are defined.</td></tr> | |||
| <tr><td>hierarchical.levelSeparation</td><td class="mid">Number</td><td class="mid"><code>150</code></td> <td>The distance between the different levels.</td></tr> | |||
| <tr><td>hierarchical.direction</td><td class="mid">String</td><td class="mid"><code>'UD'</code></td> <td>The direction of the hierarchical layout. The available options are: <code>UD, DU, LR, RL</code>. To simplify: up-down, down-up, left-right, right-left.</td></tr> | |||
| <tr><td>hierarchical.sortMethod</td><td class="mid">String</td><td class="mid"><code>'hubsize'</code></td> <td>The algorithm used to ascertain the levels of the nodes based on the data. The possible options are: <code>hubsize, directed</code>. <br><br> | |||
| Hubsize takes the nodes with the most edges and puts them at the top. From that the rest of the hierarchy is evaluated. <br><br> | |||
| Directed adheres to the to and from data of the edges. A --> B so B is a level lower than A.</td></tr> | |||
| </table> | |||
| <h3>Methods</h3> | |||
| <p>This is a list of all the methods in the public API. Options can be set directly to the module or you can use the setOptions method of the network itself and use the module name as an object name.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"> <td class="method">name</td><td>returns</td><td>description</td></tr> | |||
| <tr><td>getSeed()</td> <td class="mid">Number</td><td>If you like the layout of your network and would like it to start in the same way next time, ask for the seed using this method and put it in the <code>randomSeed</code> option.</td></tr> | |||
| </table> | |||
| <h3>Events</h3> | |||
| <p>There are no events emitted by the layout module.</p> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| </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> | |||
+ 120
- 0
docs/network/new_network.html
View File
| @ -0,0 +1,120 @@ | |||
| <!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"> | |||
| <meta charset="utf-8"> | |||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||
| <meta name="description" content=""> | |||
| <meta name="author" content=""> | |||
| <link rel="icon" HREF="favicon.ico"> | |||
| <title>vis.js - A dynamic, browser based visualization library.</title> | |||
| <!-- Bootstrap core CSS --> | |||
| <link href="../css/bootstrap.css" rel="stylesheet"> | |||
| <link href="../css/newdocs.css" rel="stylesheet"> | |||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | |||
| <!--[if lt IE 9]> | |||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | |||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |||
| <![endif]--> | |||
| <script src="../js/smooth-scroll.min.js"></script> | |||
| <script language="JavaScript"> | |||
| smoothScroll.init(); | |||
| </script> | |||
| <style> | |||
| td.blue { | |||
| background-color: #89b3ff; | |||
| } | |||
| td.gren { | |||
| background-color: #bfffc7; | |||
| } | |||
| </style> | |||
| </head> | |||
| <!-- 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="../index.html#modules">Modules</a></li> | |||
| <li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon" src="../images/external-link-icons/external-link-icon-white.png"></a></li> | |||
| <li><a href="../blog.html">Blog</a></li> | |||
| <li><a href="../index.html#download_install">Download</a></li> | |||
| <li><a href="../showcase/index.html">Showcase</a></li> | |||
| <li><a href="../index.html#contribute">Contribute</a></li> | |||
| <li><a href="../featureRequests.html">Feature requests</a></li> | |||
| <li><a href="../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> | |||
| <div class="container full"> | |||
| <h1>Network</h1> | |||
| <p>As of 4.0, the network consists of individual modules which handle specific parts of the network. These modules have their own docs, options, methods and events which you can access | |||
| by clicking on the modules in the list below.</p> | |||
| <h3>Modules</h3> | |||
| <table class="moduleTable"> | |||
| <tr><td width="120px" class="gren"><a href="./canvas.html">canvas</a></td> <td>Handles the HTML part of the network.</td></tr> | |||
| <tr><td class="gren"><a href="./configure.html">configure</a></td> <td>Generates an interactive option editor with filtering.</td></tr> | |||
| <tr><td class="gren"><a href="./rendering.html">rendering</a></td> <td>Handles the rendering aspect of vis. It governs the render loop, it draws the nodes and edges and provides events to allow users to hook into the drawing.</td></tr> | |||
| <tr><td class="blue"><a href="./groups.html">groups</a></td> <td>Contains the groups and some options on how to handle nodes with non-existing groups.</td></tr> | |||
| <tr><td class="gren"><a href="./nodes.html">nodes</a></td> <td>Handles the creation and deletion of nodes and contains the global node options and styles.</td></tr> | |||
| <tr><td class="gren"><a href="./edges.html">edges</a></td> <td>Handles the creation and deletion of edges and contains the global edge options and styles.</td></tr> | |||
| <tr><td class="gren"><a href="./layout.html">layout</a></td> <td>Governs the initial and hierarchical positioning.</td></tr> | |||
| <tr><td class="gren"><a href="./physics.html">physics</a></td> <td>Does all the simulation moving the nodes and edges to their final positions, also governs stabilization.</td></tr> | |||
| <tr><td class="gren"><a href="./view.html">view</a></td> <td>Acts as the camera that looks on the canvas. Does the animation, zooming and focusing.</td></tr> | |||
| <tr><td class="gren"><a href="./interaction.html">interaction</a></td> <td>Used for all user interaction with the network. Handles mouse and touch events as well as the navigation buttons and the popups.</td></tr> | |||
| <tr><td class="gren"><a href="./selection.html">selection</a></td> <td>Handles the selection of nodes and edges.</td></tr> | |||
| <tr><td class="blue"><a href="./clustering.html">clustering</a></td> <td>Provides the clustering api, giving users full control over the formed clusters.</td></tr> | |||
| <tr><td class="blue"><a href="./manipulation.html">manipulation</a></td> <td>Supplies an API and optional GUI to alter the data in the network.</td></tr> | |||
| </table> | |||
| <h3>All Methods</h3> | |||
| <p>This is a list of all the methods in the public API. They are collected here from all individual modules.</p> | |||
| <h3>All Events</h3> | |||
| <p>This is a list of all the events in the public API. They are collected here from all individual modules.</p> | |||
| </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> | |||
+ 179
- 0
docs/network/nodes.html
View File
| @ -0,0 +1,179 @@ | |||
| <!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"> | |||
| <meta charset="utf-8"> | |||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||
| <meta name="description" content=""> | |||
| <meta name="author" content=""> | |||
| <link rel="icon" HREF="favicon.ico"> | |||
| <title>vis.js - A dynamic, browser based visualization library.</title> | |||
| <!-- Bootstrap core CSS --> | |||
| <link href="../css/bootstrap.css" rel="stylesheet"> | |||
| <link href="../css/newdocs.css" rel="stylesheet"> | |||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | |||
| <!--[if lt IE 9]> | |||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | |||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |||
| <![endif]--> | |||
| <script src="../js/smooth-scroll.min.js"></script> | |||
| <script language="JavaScript"> | |||
| smoothScroll.init(); | |||
| </script> | |||
| <style> | |||
| </style> | |||
| </head> | |||
| <!-- 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="../index.html#modules">Modules</a></li> | |||
| <li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon" src="../images/external-link-icons/external-link-icon-white.png"></a></li> | |||
| <li><a href="../blog.html">Blog</a></li> | |||
| <li><a href="../index.html#download_install">Download</a></li> | |||
| <li><a href="../showcase/index.html">Showcase</a></li> | |||
| <li><a href="../index.html#contribute">Contribute</a></li> | |||
| <li><a href="../featureRequests.html">Feature requests</a></li> | |||
| <li><a href="../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> | |||
| <div class="container full"> | |||
| <h1>Network - nodes</h1> | |||
| <p>Handles the creation and deletion of nodes and contains the global node options and styles.</p> | |||
| <h3>Options</h3> | |||
| <p>This is a list of all the methods in the public API. They are collected here from all individual modules.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td> <td>type</td> <td>default</td> <td>description</td></tr> | |||
| <tr><td>borderWidth</td> <td class="mid">Number</td> <td class="mid"><code>1</code></td> <td>The width of the border of the node.</td></tr> | |||
| <tr><td>borderWidthSelected</td> <td class="mid">Number</td> <td class="mid"><code>undefined</code></td> <td>The width of the border of the node when it is selected. When undefined, the borderWidth is used</td></tr> | |||
| <tr><td>brokenImage</td> <td class="mid">String</td> <td class="mid"><code>undefined</code></td> <td>When the shape is set to <code>image</code> or <code>circularImage</code>, this option can be an URL to a backup image in case the URL supplied in the image option cannot be resolved.</td></tr> | |||
| <tr><td>color</td> <td class="mid">Object | String</td><td class="mid"><code>Object</code></td> <td>The color object contains the color information of the node in every situation. When the node only needs a single color, a color value like <code>'rgba(120,32,14,1)'</code>, <code>'#ffffff'</code> or <code>'red'</code> can be supplied instead of an object.</td></tr> | |||
| <tr><td>color.border</td> <td class="mid">String</td> <td class="mid"><code>'#2B7CE9'</code></td> <td>The color of the border of the node when it is not selected or hovered over <i>(assuming hover is enabled in the interaction module)</i>.</td></tr> | |||
| <tr><td>color.background</td> <td class="mid">String</td> <td class="mid"><code>'#D2E5FF'</code></td> <td>The color of the background of the node when it is not selected or hovered over <i>(assuming hover is enabled in the interaction module)</i>.</td></tr> | |||
| <tr><td>color.highlight</td> <td class="mid">Object | String</td><td class="mid"><code>Object</code></td> <td>The color the node when it is selected. Alternatively you can just supply a string color value.</td></tr> | |||
| <tr><td>color.highlight.border</td><td class="mid">String</td> <td class="mid"><code>'#2B7CE9'</code></td> <td>The color of the border of the node when it is selected.</td></tr> | |||
| <tr><td>color.highlight.background</td><td class="mid">String</td> <td class="mid"><code>'#D2E5FF'</code></td> <td>The color of the background of the node when it is selected.</td></tr> | |||
| <tr><td>color.hover</td> <td class="mid">Object/String</td><td class="mid"><code>Object</code></td> <td>The color the node when the mouse hovers over it <i>(assuming hover is enabled in the interaction module)</i>. Shorthand like above is also supported.</td></tr> | |||
| <tr><td>color.hover.border</td> <td class="mid">String</td> <td class="mid"><code>'#2B7CE9'</code></td> <td>The color of the border of the node when the mouse hovers over it <i>(assuming hover is enabled in the interaction module)</i>.</td></tr> | |||
| <tr><td>color.hover.background</td> <td class="mid">String</td> <td class="mid"><code>'#D2E5FF'</code></td> <td>The color of the background of the node when the mouse hovers over it <i>(assuming hover is enabled in the interaction module)</i>.</td></tr> | |||
| <tr><td>fixed</td> <td class="mid">Object | Boolean</td><td class="mid"><code>Object</code></td> <td>When true, the node will not move but IS part of the physics simulation. When defined as an object, movement in either X or Y direction can be disabled.</td></tr> | |||
| <tr><td>fixed.x</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>When true, the node will not move in the X direction.</td></tr> | |||
| <tr><td>fixed.y</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>When true, the node will not move in the Y direction.</td></tr> | |||
| <tr><td>font</td> <td class="mid">Object | String</td><td class="mid"><code>false</code></td> <td>This object defines the details of the label. A shorthand is also supported in the form <code>'size face color'</code> for example: <code>'14px arial red'</code>.</td></tr> | |||
| <tr><td>font.color</td> <td class="mid">String</td> <td class="mid"><code>'#343434'</code></td> <td>Color of the label text.</td></tr> | |||
| <tr><td>font.size</td> <td class="mid">Number</td> <td class="mid"><code>14</code></td> <td>Size of the label text.</td></tr> | |||
| <tr><td>font.face</td> <td class="mid">String</td> <td class="mid"><code>'arial'</code></td> <td>Font face (or font family) of the label text.</td></tr> | |||
| <tr><td>font.background</td> <td class="mid">String</td> <td class="mid"><code>undefined</code></td> <td>When not <code>undefined</code> but a <b>color string</b>, a background rectangle will be drawn behind the label in the supplied color.</td></tr> | |||
| <tr><td>font.stroke</td> <td class="mid">Number</td> <td class="mid"><code>0</code></td> <td>As an alternative to the background rectangle, a stroke can be drawn around the text. When a value higher than 0 is supplied, the stroke will be drawn.</td></tr> | |||
| <tr><td>font.strokeColor</td> <td class="mid">String</td> <td class="mid"><code>'#ffffff'</code></td> <td>This is the color of the stroke <i>assuming the value for stroke is higher than 0</i>.</td></tr> | |||
| <tr><td>group</td> <td class="mid">String</td> <td class="mid"><code>undefined</code></td> <td>When not <code>undefined</code>, the</td></tr> | |||
| <tr><td>hidden</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>When true, the node will not be shown. It will still be part of the physics simulation though!</td></tr> | |||
| <tr><td>icon.face</td> <td class="mid">String</td> <td class="mid"><code>'FontAwesome'</code></td><td>These options are only used when the shape is set to <code>icon</code>. The possible options for the face are: <code>'FontAwesome'</code> and <code>'Ionicons'</code>.</td></tr> | |||
| <tr><td>icon.code</td> <td class="mid">String</td> <td class="mid"><code>undefined</code></td> <td>This is the code of the icon, for example <code>'\uf007'</code>.</td></tr> | |||
| <tr><td>icon.size</td> <td class="mid">Number</td> <td class="mid"><code>50</code></td> <td>The size of the icon.</td></tr> | |||
| <tr><td>icon.color</td> <td class="mid">String</td> <td class="mid"><code>'#2B7CE9'</code></td> <td>The color of the icon.</td></tr> | |||
| <tr><td>image</td> <td class="mid">String</td> <td class="mid"><code>undefined</code></td> <td>When the shape is set to <code>image</code> or <code>circularImage</code>, this option should be the URL to an image. If the image cannot be found, the brokenImage option can be used.</td></tr> | |||
| <tr><td>label</td> <td class="mid">String</td> <td class="mid"><code>undefined</code></td> <td>The label is the piece of text shown in or under the node, depending on the shape.</td></tr> | |||
| <tr><td>level</td> <td class="mid">Number</td> <td class="mid"><code>undefined</code></td> <td>When using the hierarchical layout, the level determines where the node is going to be positioned.</td></tr> | |||
| <tr><td>mass</td> <td class="mid">Number</td> <td class="mid"><code>1</code></td> <td>The barnesHut physics model (which is enabled by default) is based on an inverted gravity model. By increasing the mass of a node, you increase it's repulsion. Values lower than 1 are not recommended.</td></tr> | |||
| <tr><td>physics</td> <td class="mid">Boolean</td> <td class="mid"><code>true</code></td> <td>When false, the node is not part of the physics simulation. It will not move except for from manual dragging.</td></tr> | |||
| <tr><td>scaling</td> <td class="mid">Object</td> <td class="mid"><code>Object</code></td> <td>If the <code>value</code> option is specified, the size of the nodes will be scaled according to the properties in this object. All node shapes can be scaled, but some only when label scaling is enabled as their size is based on the size of the label. | |||
| Only scalable when label scaling is enabled are: | |||
| <code>ellipse</code>, <code>circle</code>, <code>database</code>, <code>box</code>, <code>text</code>. | |||
| Always scalable are: | |||
| <code>image</code>, <code>circularImage</code>, <code>diamond</code>, <code>dot</code>, | |||
| <code>star</code>, <code>triangle</code>, <code>triangleDown</code>, <code>square</code> and <code>icon</code>. Keep in mind that when using scaling, the <code>size</code> option is neglected.</td></tr> | |||
| <tr><td>scaling.min</td> <td class="mid">Number</td> <td class="mid"><code>10</code></td> <td>If nodes have a value, their sizes are determined by the value, the scaling function and the min max values. The min value is the minimum allowed value.</td></tr> | |||
| <tr><td>scaling.max</td> <td class="mid">Number</td> <td class="mid"><code>30</code></td> <td>This is the maximum allowed size when the nodes are scaled using the value option.</td></tr> | |||
| <tr><td>scaling.label</td> <td class="mid">Object | Boolean</td><td class="mid"><code>Object</code></td><td>This can be false if the label is not allowed to scale with the node. If true it will scale using default settigns. For further customization, you can supply an object.</td></tr> | |||
| <tr><td>scaling.label.enabled</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>Toggle the scaling of the label on or off. If this option is not defined, it is set to true if any of the properties in this object are defined.</td></tr> | |||
| <tr><td>scaling.label.min</td> <td class="mid">Number</td> <td class="mid"><code>14</code></td> <td>The minimum font-size used for labels when scaling.</td></tr> | |||
| <tr><td>scaling.label.max</td> <td class="mid">Number</td> <td class="mid"><code>30</code></td> <td>The maximum font-size used for labels when scaling.</td></tr> | |||
| <tr><td>scaling.label.maxVisible</td><td class="mid">Number</td> <td class="mid"><code>30</code></td> <td>When zooming in, the font is drawn larger as well. You can limit the perceived font size using this option. If set to 30, the font will never look larger than size 30 zoomed at 100%.</td></tr> | |||
| <tr><td>scaling.label.drawThreshold</td><td class="mid">Number</td> <td class="mid"><code>3</code></td> <td>When zooming out, the font will be drawn smaller. This defines a lower limit for when the font is drawn. When using font scaling, you can use this together with the maxVisible to first show labels of important nodes when zoomed out and only show the rest when zooming in.</td></tr> | |||
| <tr><td>scaling.customScalingFunction</td> <td class="mid">Function</td> <td class="mid">in description</td> <td>If nodes have <code>value</code> fields, this function determines how the size of the nodes are scaled based on their values. The default function is: | |||
| <pre> | |||
| function (min,max,total,value) { | |||
| if (max === min) { | |||
| return 0.5; | |||
| } | |||
| else { | |||
| var scale = 1 / (max - min); | |||
| return Math.max(0,(value - min)*scale); | |||
| } | |||
| } | |||
| </pre> | |||
| The function receives the minimum value of the set, the maximum value, the total sum of all values and finally the value of the node or edge it works on. <b>It has to return a value between 0 and 1.</b> The nodes and edges then calculate their size as follows: | |||
| <pre> | |||
| var scale = customScalingFunction(min,max,total,value); | |||
| var diff = maxSize - minSize; | |||
| mySize = minSize + diff * scale; | |||
| </pre> | |||
| </td></tr> | |||
| <tr><td>shadow</td> <td class="mid">Object | Boolean</td> <td class="mid"><code>Object</code></td><td>When true, the node casts a shadow using the default settings. This can be further refined by supplying an object.</td></tr> | |||
| <tr><td>shadow.enabled</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>Toggle the casting of shadows. If this option is not defined, it is set to true if any of the properties in this object are defined.</td></tr> | |||
| <tr><td>shadow.size</td> <td class="mid">Number</td> <td class="mid"><code>10</code></td> <td>The blur size of the shadow.</td></tr> | |||
| <tr><td>shadow.x</td> <td class="mid">Number</td> <td class="mid"><code>5</code></td> <td>The x offset.</td></tr> | |||
| <tr><td>shadow.y</td> <td class="mid">Number</td> <td class="mid"><code>5</code></td> <td>The y offset.</td></tr> | |||
| <tr><td>shape</td> <td class="mid">String</td> <td class="mid"><code>'ellipse'</code></td> <td>The shape defines what the node looks like. There are two types of nodes. One type has the label inside of it and the other type has the label underneath it. The types with the label inside of it are: | |||
| <code>ellipse</code>, <code>circle</code>, <code>database</code>, <code>box</code>, <code>text</code>. | |||
| The ones with the label outside of it are: <code>image</code>, <code>circularImage</code>, <code>diamond</code>, <code>dot</code>, <code>star</code>, <code>triangle</code>, <code>triangleDown</code>, <code>square</code> and <code>icon</code>.</td></tr> | |||
| <tr><td>size</td> <td class="mid">Number</td> <td class="mid"><code>25</code></td> <td>The size is used to determine the size of node shapes that do not have the label inside of them. These shapes are: <code>image</code>, <code>circularImage</code>, <code>diamond</code>, <code>dot</code>, | |||
| <code>star</code>, <code>triangle</code>, <code>triangleDown</code>, <code>square</code> and <code>icon</code></td></tr> | |||
| <tr><td>title</td> <td class="mid">String | Element</td> <td class="mid"><code>undefined</code></td> <td>Title to be displayed when the user hovers over the node. The title can be an HTML element or a string containing plain text or HTML.</td></tr> | |||
| <tr><td>value</td> <td class="mid">Number</td> <td class="mid"><code>undefined</code></td> <td>When a value is set, the nodes will be scaled using the options in the scaling object defined above.</td></tr> | |||
| <tr><td>x</td> <td class="mid">Number</td> <td class="mid"><code>undefined</code></td> <td>This gives a node an initial x position. When using the hierarchical layout, either the x or y position is set by the layout engine depending on the type of view. The other value remains untouched. When using stabilization, the stabilized position may be different from the initial one. To lock the node to that position use the physics or fixed options.</td></tr> | |||
| <tr><td>y</td> <td class="mid">Number</td> <td class="mid"><code>undefined</code></td> <td>This gives a node an initial y position. When using the hierarchical layout, either the x or y position is set by the layout engine depending on the type of view. The other value remains untouched. When using stabilization, the stabilized position may be different from the initial one. To lock the node to that position use the physics or fixed options.</td></tr> | |||
| </table> | |||
| <h3>Methods</h3> | |||
| <p>The nodes module has no methods.</p> | |||
| <h3>Events</h3> | |||
| <p>The nodes module emits no events. Click and select events are emitted from the interaction and selection modules.</p> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| </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> | |||
+ 175
- 0
docs/network/physics.html
View File
| @ -0,0 +1,175 @@ | |||
| <!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"> | |||
| <meta charset="utf-8"> | |||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||
| <meta name="description" content=""> | |||
| <meta name="author" content=""> | |||
| <link rel="icon" HREF="favicon.ico"> | |||
| <title>vis.js - A dynamic, browser based visualization library.</title> | |||
| <!-- Bootstrap core CSS --> | |||
| <link href="../css/bootstrap.css" rel="stylesheet"> | |||
| <link href="../css/newdocs.css" rel="stylesheet"> | |||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | |||
| <!--[if lt IE 9]> | |||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | |||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |||
| <![endif]--> | |||
| <script src="../js/smooth-scroll.min.js"></script> | |||
| <script language="JavaScript"> | |||
| smoothScroll.init(); | |||
| </script> | |||
| <style> | |||
| td.properties { | |||
| width:350px; | |||
| } | |||
| pre.code { | |||
| padding:2px 4px; | |||
| font-size:90%; | |||
| color:#c7254e; | |||
| background-color:#f9f2f4; | |||
| border-radius:4px; | |||
| border:0px; | |||
| } | |||
| td.type { | |||
| width:150px; | |||
| } | |||
| tr.hidden { | |||
| display:none; | |||
| } | |||
| </style> | |||
| </head> | |||
| <!-- 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="../index.html#modules">Modules</a></li> | |||
| <li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon" src="../images/external-link-icons/external-link-icon-white.png"></a></li> | |||
| <li><a href="../blog.html">Blog</a></li> | |||
| <li><a href="../index.html#download_install">Download</a></li> | |||
| <li><a href="../showcase/index.html">Showcase</a></li> | |||
| <li><a href="../index.html#contribute">Contribute</a></li> | |||
| <li><a href="../featureRequests.html">Feature requests</a></li> | |||
| <li><a href="../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> | |||
| <div class="container full"> | |||
| <h1>Network - physics</h1> | |||
| <p>Handles the HTML part of the canvas.</p> | |||
| <h3>Options</h3> | |||
| <p>This is a list of all the methods in the public API. They are collected here from all individual modules.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td class="type">type</td><td>default</td><td>description</td></tr> | |||
| <tr onclick=""><td><span parent="barnesHut" class="caret"></span> barnesHut</td> <td class="mid">Object</td> <td class="mid"><code>Object</code></td> <td>BarnesHut is a quadtree based gravity model. This is the fastest, default and recommended solver for non-hierarchical layouts.</td></tr> | |||
| <tr parent="barnesHut" class="hidden"><td>barnesHut.gravitationalConstant</td> <td class="mid">Number</td> <td class="mid"><code>-2000</code></td> <td>Gravity attracts. We like repulsion. So the value is negative. If you want the repulsion to be stronger, decrease the value (so -10000, -50000).</td></tr> | |||
| <tr parent="barnesHut" class="hidden"><td>barnesHut.centralGravity</td> <td class="mid">Number</td> <td class="mid"><code>0.3</code></td> <td>There is a central gravity attractor to pull the entire network back to the center.</td></tr> | |||
| <tr parent="barnesHut" class="hidden"><td>barnesHut.springLength</td> <td class="mid">Number</td> <td class="mid"><code>95</code></td> <td>The edges are modelled as springs. This springLength here is the the rest length of the spring.</td></tr> | |||
| <tr parent="barnesHut" class="hidden"><td>barnesHut.springConstant</td> <td class="mid">Number</td> <td class="mid"><code>0.04</code></td> <td>This is how 'sturdy' the springs are. Higher values mean stronger springs.</td></tr> | |||
| <tr parent="barnesHut" class="hidden"><td>barnesHut.damping</td> <td class="mid">Number</td> <td class="mid"><code>0.09</code></td> <td>Accepted range: <code>[0 .. 1]</code>. The damping factor is how much of the velocity from the previous physics simulation iteration carries over to the next iteration.</td></tr> | |||
| <tr><td>repulsion</td> <td class="mid">Object</td> <td class="mid"><code>Object</code></td> <td>The repulsion model assumes nodes have a simplified repulsion field around them. It's force linearly decreases from 1 (at 0.5*nodeDistance and smaller) to 0 (at 2*nodeDistance).</td></tr> | |||
| <tr><td>repulsion.nodeDistance</td> <td class="mid">Number</td> <td class="mid"><code>100</code></td> <td>This is the range of influence for the repulsion.</td></tr> | |||
| <tr><td>repulsion.centralGravity</td> <td class="mid">Number</td> <td class="mid"><code>0.2</code></td> <td>There is a central gravity attractor to pull the entire network back to the center.</td></tr> | |||
| <tr><td>repulsion.springLength</td> <td class="mid">Number</td> <td class="mid"><code>200</code></td> <td>The edges are modelled as springs. This springLength here is the the rest length of the spring.</td></tr> | |||
| <tr><td>repulsion.springConstant</td> <td class="mid">Number</td> <td class="mid"><code>0.05</code></td> <td>This is how 'sturdy' the springs are. Higher values mean stronger springs.</td></tr> | |||
| <tr><td>repulsion.damping</td> <td class="mid">Number</td> <td class="mid"><code>0.09</code></td> <td>Accepted range: <code>[0 .. 1]</code>. The damping factor is how much of the velocity from the previous physics simulation iteration carries over to the next iteration.</td></tr> | |||
| <tr><td>hierarchicalRepulsion</td> <td class="mid">Object</td> <td class="mid"><code>Object</code></td> <td>This model is based on the repulsion solver but the levels are taken into account and the forces are normalized.</td></tr> | |||
| <tr><td>hierarchicalRepulsion.nodeDistance</td> <td class="mid">Number</td> <td class="mid"><code>120</code></td> <td>This is the range of influence for the repulsion.</td></tr> | |||
| <tr><td>hierarchicalRepulsion.centralGravity</td> <td class="mid">Number</td> <td class="mid"><code>0.0'</code></td> <td>There is a central gravity attractor to pull the entire network back to the center.</td></tr> | |||
| <tr><td>hierarchicalRepulsion.springLength</td> <td class="mid">Number</td> <td class="mid"><code>100</code></td> <td>The edges are modelled as springs. This springLength here is the the rest length of the spring.</td></tr> | |||
| <tr><td>hierarchicalRepulsion.springConstant</td> <td class="mid">Number</td> <td class="mid"><code>0.01</code></td> <td>This is how 'sturdy' the springs are. Higher values mean stronger springs.</td></tr> | |||
| <tr><td>hierarchicalRepulsion.damping</td> <td class="mid">Number</td> <td class="mid"><code>0.09</code></td> <td>Accepted range: <code>[0 .. 1]</code>. The damping factor is how much of the velocity from the previous physics simulation iteration carries over to the next iteration.</td></tr> | |||
| <tr><td>maxVelocity</td> <td class="mid">Number</td> <td class="mid"><code>50</code></td> <td>The physics module limits the maximum velocity of the nodes to increase the time to stabilization. This is the maximium value.</td></tr> | |||
| <tr><td>minVelocity</td> <td class="mid">Number</td> <td class="mid"><code>0.1</code></td> <td>Once the minimum velocity is reached for all nodes, we assume the network has been stabilized and the simulation stops.</td></tr> | |||
| <tr><td>solver</td> <td class="mid">String</td> <td class="mid"><code>'barnesHut'</code></td><td>You can select your own solver. Possible options: <code>'barnesHut','repulsion','hierarchicalRepulsion'</code>. When setting the hierarchical layout, the hierarchical repulsion solver is automaticaly selected, regardless of what you fill in here.</td></tr> | |||
| <tr><td>stabilization</td> <td class="mid">Object | Boolean</td><td class="mid"><code>Object</code></td> <td>When true, the network is stabilized on load using default settings. If false, stabilization is disabled. To further customize this, you can supply an object.</td></tr> | |||
| <tr><td>stabilization.enabled</td> <td class="mid">Boolean</td> <td class="mid"><code>true</code></td> <td>Toggle the stabilization. This is an optional property. If undefined, it is automatically set to true when any of the properties of this object are defined.</td></tr> | |||
| <tr><td>stabilization.iterations</td> <td class="mid">Number</td> <td class="mid"><code>1000</code></td> <td>The physics module tries to stabilize the network on load up til a maximum number of iterations defined here. If the network stabilized with less, you are finished before the maximum number.</td></tr> | |||
| <tr><td>stabilization.updateInterval</td> <td class="mid">Number</td> <td class="mid"><code>100</code></td> <td>When stabilizing, the DOM can freeze. You can chop the stabilization up into pieces to show a loading bar for instance. The interval determines after how many iterations the <code>stabilizationProgress</code> event is triggered.</td></tr> | |||
| <tr><td>stabilization.onlyDynamicEdges</td> <td class="mid">Boolean</td> <td class="mid"><code>false</code></td> <td>If you have predefined the position of all nodes and only want to stabilize the dynamic smooth edges, set this to true. It freezes all nodes except the invisible dynamic smooth curve support nodes. If you want the visible nodes to move and stabilize, do not use this.</td></tr> | |||
| <tr><td>stabilization.zoomExtent</td> <td class="mid">Boolean</td> <td class="mid"><code>true</code></td> <td>Toggle whether or not you want the view to zoom to fit all nodes when the stabilization is finished.</td></tr> | |||
| <tr><td>timestep</td> <td class="mid">Number</td> <td class="mid"><code>0.5</code></td> <td>The physics simulation is discrete. This means we take a step in time, calculate the forces, move the nodes and take another step. If you increase this number the steps will be too large and the network can get unstable. If you see a lot of jittery movement in the network, you may want to reduce this value a little.</td></tr> | |||
| </table> | |||
| <h3>Methods</h3> | |||
| <p>This is a list of all the methods in the public API. Options can be set directly to the module or you can use the setOptions method of the network itself and use the module name as an object name.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td>returns</td><td>description</td></tr> | |||
| <tr><td>startSimulation()</td> <td class="mid">none</td><td>Start the physics simulation. This is normally done whenever needed and is only really useful if you stop the simulation yourself and wish to continue it afterwards.</td>.</td></tr> | |||
| <tr><td>stopSimulation()</td> <td class="mid">none</td><td>This stops the physics simulation and triggers a <code>stabilized</code> event. It can be restarted by dragging a node, altering the dataset or calling <code>startSimulation()</code>.</td></tr> | |||
| <tr><td>stabilize()</td> <td class="mid">none</td><td>You can manually call stabilize at any time. All the stabilization options above are used.</td></tr> | |||
| </table> | |||
| <h3>Events</h3> | |||
| <p>This is a list of all the events in the public API. They are collected here from all individual modules.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td class="properties">properties</td><td>description</td></tr> | |||
| <tr><td>startStabilizing</td><td class="mid">none</td><td>Fired when stabilization starts. This is also the case when you drag a node and the physics simulation restarts to stabilize again. Stabilization does not neccesarily imply 'without showing'.</td> | |||
| <tr><td>stabilizationProgress</td><td class="mid"> | |||
| <pre class="code"> | |||
| { | |||
| iterations: Number // iterations so far, | |||
| total: Number // total iterations in options | |||
| } | |||
| </pre></td><td>Fired when a multiple of the <code>updateInterval</code> number of iterations is reached. This only occurs in the 'hidden' stabilization.</td></tr> | |||
| <tr><td>stabilizationIterationsDone</td><td class="mid">none</td><td>Fired when the 'hidden' stabilization finishes. This does not necessarily mean the network is stabilized; it could also mean that the amount of iterations defined in the options has been reached.</td> | |||
| <tr><td>stabilized</td><td class="mid"> | |||
| <pre class="code"> | |||
| { | |||
| iterations: Number // iterations it took | |||
| } | |||
| </pre> | |||
| </td><td>Fired when the network has stabilized or when the <code>stopSimulation()</code> has been called. The amount of iterations it took could be used to tweak the maximum amount of iterations needed to stabilize the network.</td> | |||
| </table> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| </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> | |||
+ 110
- 0
docs/network/rendering.html
View File
| @ -0,0 +1,110 @@ | |||
| <!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"> | |||
| <meta charset="utf-8"> | |||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||
| <meta name="description" content=""> | |||
| <meta name="author" content=""> | |||
| <link rel="icon" HREF="favicon.ico"> | |||
| <title>vis.js - A dynamic, browser based visualization library.</title> | |||
| <!-- Bootstrap core CSS --> | |||
| <link href="../css/bootstrap.css" rel="stylesheet"> | |||
| <link href="../css/newdocs.css" rel="stylesheet"> | |||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | |||
| <!--[if lt IE 9]> | |||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | |||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |||
| <![endif]--> | |||
| <script src="../js/smooth-scroll.min.js"></script> | |||
| <script language="JavaScript"> | |||
| smoothScroll.init(); | |||
| </script> | |||
| <style> | |||
| </style> | |||
| </head> | |||
| <!-- 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="../index.html#modules">Modules</a></li> | |||
| <li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon" src="../images/external-link-icons/external-link-icon-white.png"></a></li> | |||
| <li><a href="../blog.html">Blog</a></li> | |||
| <li><a href="../index.html#download_install">Download</a></li> | |||
| <li><a href="../showcase/index.html">Showcase</a></li> | |||
| <li><a href="../index.html#contribute">Contribute</a></li> | |||
| <li><a href="../featureRequests.html">Feature requests</a></li> | |||
| <li><a href="../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> | |||
| <div class="container full"> | |||
| <h1>Network - rendering</h1> | |||
| <p>Handles the rendering aspect of vis. It governs the render loop, it draws the nodes and edges and provides events to allow users to hook into the drawing.</p> | |||
| <h3>Options</h3> | |||
| <p>This is a list of all the methods in the public API. They are collected here from all individual modules.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td>type</td><td>default</td><td>description</td></tr> | |||
| <tr><td>hideEdgesOnDrag</td><td class="mid">Boolean</td><td class="mid"><code>false</code></td><td>When true, the edges are not drawn when dragging the view. This can greatly speed up responsiveness on dragging, improving user experience.</td></tr> | |||
| <tr><td>hideNodesOnDrag</td><td class="mid">Boolean</td><td class="mid"><code>false</code></td><td>When true, the nodes are not drawn when dragging the view. This can greatly speed up responsiveness on dragging, improving user experience.</td></tr> | |||
| </table> | |||
| <h3>Methods</h3> | |||
| <p>This is a list of all the methods in the public API. Options can be set directly to the module or you can use the setOptions method of the network itself and use the module name as an object name.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td>returns</td><td>description</td></tr> | |||
| <tr><td>redraw()</td><td class="mid">none</td><td>Redraw the network.</td></tr> | |||
| </table> | |||
| <h3>Events</h3> | |||
| <p>These events are fired by the renderer and can be used to move and draw custom elements on the same canvas as the rest of the network.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td class="properties">properties</td><td>description</td></tr> | |||
| <tr><td>initRedraw</td><td class="mid">none</td><td>Fired before the redrawing begins. The simulation step has completed at this point. Can be used to move custom elements before starting drawing the new frame.</td> | |||
| <tr><td>beforeDrawing</td><td class="mid"><code>canvas context</code></td><td>Fired after the canvas has been cleared, scaled and translated to the viewing position but before all edges and nodes are drawn. Can be used to draw behind the network.</td> | |||
| <tr><td>initRedraw</td><td class="mid"><code>canvas context</code></td><td>Fired after drawing on the canvas has been completed. Can be used to draw on top of the network.</td></tr> | |||
| </table> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| </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> | |||
+ 126
- 0
docs/network/selection.html
View File
| @ -0,0 +1,126 @@ | |||
| <!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"> | |||
| <meta charset="utf-8"> | |||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||
| <meta name="description" content=""> | |||
| <meta name="author" content=""> | |||
| <link rel="icon" HREF="favicon.ico"> | |||
| <title>vis.js - A dynamic, browser based visualization library.</title> | |||
| <!-- Bootstrap core CSS --> | |||
| <link href="../css/bootstrap.css" rel="stylesheet"> | |||
| <link href="../css/newdocs.css" rel="stylesheet"> | |||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | |||
| <!--[if lt IE 9]> | |||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | |||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |||
| <![endif]--> | |||
| <script src="../js/smooth-scroll.min.js"></script> | |||
| <script language="JavaScript"> | |||
| smoothScroll.init(); | |||
| </script> | |||
| <style> | |||
| pre.code { | |||
| padding:2px 4px; | |||
| font-size:90%; | |||
| color:#c7254e; | |||
| background-color:#f9f2f4; | |||
| border-radius:4px; | |||
| border:0px; | |||
| } | |||
| td.method { | |||
| width:250px; | |||
| } | |||
| </style> | |||
| </head> | |||
| <!-- 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="../index.html#modules">Modules</a></li> | |||
| <li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon" src="../images/external-link-icons/external-link-icon-white.png"></a></li> | |||
| <li><a href="../blog.html">Blog</a></li> | |||
| <li><a href="../index.html#download_install">Download</a></li> | |||
| <li><a href="../showcase/index.html">Showcase</a></li> | |||
| <li><a href="../index.html#contribute">Contribute</a></li> | |||
| <li><a href="../featureRequests.html">Feature requests</a></li> | |||
| <li><a href="../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> | |||
| <div class="container full"> | |||
| <h1>Network - selection</h1> | |||
| <p>Handles the selection of nodes and edges.</p> | |||
| <h3>Options</h3> | |||
| <p>This is a list of all the methods in the public API. They are collected here from all individual modules.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td>type</td><td>default</td><td>description</td></tr> | |||
| <tr><td>select</td> <td class="mid">Boolean</td><td class="mid"><code>true</code></td><td>When true, the nodes and edges can be selected by the user.</td></tr> | |||
| <tr><td>selectConnectedEdges</td> <td class="mid">Boolean</td><td class="mid"><code>true</code></td><td>When true, on selecting a node, its connecting edges are highlighted.</td></tr> | |||
| </table> | |||
| <h3>Methods</h3> | |||
| <p>This is a list of all the methods in the public API. Options can be set directly to the module or you can use the setOptions method of the network itself and use the module name as an object name.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td class="method">name</td><td>returns</td><td>description</td></tr> | |||
| <tr><td>getSelection()</td> <td class="mid"> | |||
| <pre class="code"> | |||
| { | |||
| nodes: [Array of selected nodeIds], | |||
| edges: [Array of selected edgeIds] | |||
| }</pre> </td><td>Returns an object with selected nodes and edges ids.</td></tr> | |||
| <tr><td>getSelectedNodes()</td> <td class="mid"><code>[nodeId1, nodeId2, ..]</code></td><td>Returns an array of selected node ids.</td></tr> | |||
| <tr><td>getSelectedEdges()</td> <td class="mid"><code>[edgeId1, edgeId2, ..]</code></td><td>Returns an array of selected edge ids.</td></tr> | |||
| <tr><td>selectNodes(<br> <code><i>Array with nodeIds</i></code>,<br> <code><i>[Boolean highlightEdges]</i></code><br>)</td> <td class="mid">none</td><td>Selects the nodes corresponding to the id's in the input array. If highlightEdges is true or undefined, the neighbouring edges will also be selected. This method unselects all other objects before selecting its own objects. <i>Does not fire events</i>.</td></tr> | |||
| <tr><td>selectEdges(<br> <code><i>Array with edgeIds</i></code><br>)</td> <td class="mid">none</td><td>Selects the edges corresponding to the id's in the input array. This method unselects all other objects before selecting its own objects. <i>Does not fire events</i>.</td></tr> | |||
| <tr><td>unselectAll()</td> <td class="mid">none</td> <td>Unselect all objects. <i>Does not fire events</i>.</td></tr> | |||
| </table> | |||
| <h3>Events</h3> | |||
| <p>The selection handler does not fire events. All related events are fired by the interaction module because they are triggered by user interaction.</p> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| </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> | |||
+ 169
- 0
docs/network/view.html
View File
| @ -0,0 +1,169 @@ | |||
| <!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"> | |||
| <meta charset="utf-8"> | |||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |||
| <meta name="description" content=""> | |||
| <meta name="author" content=""> | |||
| <link rel="icon" HREF="favicon.ico"> | |||
| <title>vis.js - A dynamic, browser based visualization library.</title> | |||
| <!-- Bootstrap core CSS --> | |||
| <link href="../css/bootstrap.css" rel="stylesheet"> | |||
| <link href="../css/newdocs.css" rel="stylesheet"> | |||
| <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> | |||
| <!--[if lt IE 9]> | |||
| <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> | |||
| <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> | |||
| <![endif]--> | |||
| <script src="../js/smooth-scroll.min.js"></script> | |||
| <script language="JavaScript"> | |||
| smoothScroll.init(); | |||
| </script> | |||
| <style> | |||
| pre.code { | |||
| padding:2px 4px; | |||
| font-size:90%; | |||
| color:#c7254e; | |||
| background-color:#f9f2f4; | |||
| border-radius:4px; | |||
| border:0px; | |||
| } | |||
| td.method { | |||
| width:250px; | |||
| } | |||
| </style> | |||
| </head> | |||
| <!-- 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="../index.html#modules">Modules</a></li> | |||
| <li class="active"><a href="./docs/index.html" target="_blank">Documentation <img class="icon" src="../images/external-link-icons/external-link-icon-white.png"></a></li> | |||
| <li><a href="../blog.html">Blog</a></li> | |||
| <li><a href="../index.html#download_install">Download</a></li> | |||
| <li><a href="../showcase/index.html">Showcase</a></li> | |||
| <li><a href="../index.html#contribute">Contribute</a></li> | |||
| <li><a href="../featureRequests.html">Feature requests</a></li> | |||
| <li><a href="../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> | |||
| <div class="container full"> | |||
| <h1>Network - view</h1> | |||
| <p>Acts as the camera that looks on the canvas. Does the animation, zooming and focusing.</p> | |||
| <h3>Options</h3> | |||
| <p>The view has no options.</p> | |||
| <h3>Methods</h3> | |||
| <p>This is a list of all the methods in the public API. Options can be set directly to the module or you can use the setOptions method of the network itself and use the module name as an object name.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td class="method">name</td><td>returns</td><td>description</td></tr> | |||
| <tr><td>getScale()</td> <td class="mid">Number</td><td>Returns the current scale of the network. 1.0 is comparible to 100%, 0 is zoomed out infinitely.</td></tr> | |||
| <tr><td>getPosition()</td> <td class="mid">Number</td><td>Returns the current central focus point of the camera.</td></tr> | |||
| <tr><td>moveTo(<code>Object options</code>)</td> <td class="mid">none</td><td>You can animate or move the camera using the moveTo method. Options are: | |||
| <pre class="code"> | |||
| { | |||
| position: {x:Number, y:Number}, | |||
| scale: Number, | |||
| offset: {x:Number, y:Number} | |||
| animation: { // -------------------> can be a boolean too! | |||
| duration: Number | |||
| easingFunction: String | |||
| } | |||
| } | |||
| </pre> | |||
| The position (in canvas units!) is the position of the central focus point of the camera. <br><br> | |||
| The scale is the target zoomlevel. Default value is 1.0. <br><br> | |||
| The offset (in DOM units) is how many pixels from the center the view is focussed. Default value is {x:0,y:0}.<br><br> | |||
| For animation you can either use a Boolean to use it with the default options or disable it or you can define the duration (in milliseconds) and easing function manually. Available are: | |||
| <code>linear, easeInQuad, easeOutQuad, easeInOutQuad, easeInCubic, easeOutCubic, easeInOutCubic, easeInQuart, easeOutQuart, easeInOutQuart, easeInQuint, easeOutQuint, easeInOutQuint</code>. <br><br> | |||
| <i>You will have to define at least a scale or a position. Otherwise, there is nothing to move to.</i> | |||
| </td></tr> | |||
| <tr><td>zoomExtent(<code>[Object options]</code>)</td><td class="mid">none</td><td>Zooms out so all nodes fit on the canvas. You can supply options to customize this: | |||
| <pre class="code"> | |||
| { | |||
| nodes:[Array of nodeIds], | |||
| duration: Number, | |||
| easingFunction: String | |||
| } | |||
| </pre> | |||
| The nodes can be used to zoom to fit only specific nodes in the view. <br /><br /> | |||
| The other options are explained in the <code>moveTo()</code> description above. | |||
| All options are optional for zoomExtent. | |||
| </td></tr> | |||
| <tr><td>focusOnNode(<br> | |||
| <code>String nodeId</code>,<br> | |||
| <code>[Object options]</code><br>)</td><td class="mid">none</td> | |||
| <td>You can focus on a node with this function. What that means is the view will lock onto that node, if it is moving, the view will also move accordingly. If the view is dragged by the user, the focus is broken. | |||
| You can supply options to customize the effect: | |||
| <pre class="code"> | |||
| { | |||
| scale: Number, | |||
| offset: {x:Number, y:Number} | |||
| locked: boolean | |||
| animation: { // -------------------> can be a boolean too! | |||
| duration: Number | |||
| easingFunction: String | |||
| } | |||
| } | |||
| </pre> | |||
| All options except for locked are explained in the <code>moveTo()</code> description above. Locked denotes whether or not the view remains locked to the node once the zoom-in animation is finished. Default value is true. The options object is optional in focusOnNode.</td></tr> | |||
| <tr><td>releaseNode()</td><td class="mid">none</td><td>Programatically release the focussed node.</td></tr> | |||
| </table> | |||
| <h3>Events</h3> | |||
| <p>These events are fired by the renderer and can be used to move and draw custom elements on the same canvas as the rest of the network.</p> | |||
| <table class="moduleTable"> | |||
| <tr class="header"><td>name</td><td class="properties">properties</td><td>description</td></tr> | |||
| <tr><td>animationFinished</td><td class="mid">none</td><td>Fired when an animation is finished.</td> | |||
| </table> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| <br /> | |||
| </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> | |||