Released version 4.8.1

docs/graph2d/index.html

@@ -383,8 +383,8 @@ groups.add({
         <tr>
             <td>visible</td>
             <td>Boolean</td>
-            <td>true</td>
-            <td>This field is optional. If false, this group will not be drawn.
+            <td>no</td>
+            <td>This field is optional. If false, this group will not be drawn. By default it is true.
         </tr>
     </table>
 
@@ -901,14 +901,14 @@ function (option, path) {
             <td>locale</td>
             <td>String</td>
             <td>none</td>
-            <td>Select a locale for the Graph2d. See section <a href="timeline.html#Localization">Localization</a> for more information.</td>
+            <td>Select a locale for the Graph2d. See section <a href="#Localization">Localization</a> for more information.</td>
         </tr>
 
         <tr>
             <td>locales</td>
             <td>Object</td>
             <td>none</td>
-            <td>A map with i18n locales. See section <a href="timeline.html#Localization">Localization</a> for more information.</td>
+            <td>A map with i18n locales. See section <a href="#Localization">Localization</a> for more information.</td>
         </tr>
 
         <tr>
@@ -1492,4 +1492,4 @@ var options = {
 <script src="../js/tipuesearch.config.js"></script>
 <script src="../js/tipuesearch.js"></script>
 <!-- controller -->
-<script src="../js/main.js"></script>
+<script src="../js/main.js"></script>

docs/network/index.html

@@ -323,7 +323,7 @@ network.setOptions(options);
             <tr><td id="event_locales">locales</td>
                 <td>Object</td>
                 <td>defaultLocales</td>
-                <td>Locales object. By default only <code>'en'</code>, <code>'es'</code> and <code>'nl'</code> are supported. Take a look
+                <td>Locales object. By default only <code>'en'</code>, <code>'de'</code>, <code>'es'</code> and <code>'nl'</code> are supported. Take a look
                     at
                     the <a href="#locales" data-scroll=""
                            data-options="{ &quot;easing&quot;: &quot;easeInCubic&quot; }">locales
@@ -333,11 +333,7 @@ network.setOptions(options);
             <tr><td id="event_clickToUse">clickToUse</td>
                 <td>Boolean</td>
                 <td>false</td>
-                <td>Locales object. By default only <code>'en'</code>, <code>'es'</code> and <code>'nl'</code> are supported. Take a look
-                    at
-                    the <a href="#locales" data-scroll=""
-                           data-options="{ &quot;easing&quot;: &quot;easeInCubic&quot; }">locales
-                        section below</a> for more explaination on how to customize this.
+                <td>When a Network is configured to be <code>clickToUse</code>, it will react to mouse and touch events only when active. When active, a blue shadow border is displayed around the Network. The network is set active by clicking on it, and is changed to inactive again by clicking outside the Network or by pressing the ESC key.
                 </td>
             </tr>
             <tr><td id="event_configure">configure</td>

docs/timeline/index.html

@@ -939,6 +939,13 @@ function (option, path) {
       <td>A template function used to generate the contents of the items. The function is called by the Timeline with an items data as argument, and must return HTML code as result. When the option template is specified, the items do not need to have a field <code>content</code>. See section <a href="#Templates">Templates</a> for a detailed explanation.</td>
     </tr>
 
+    <tr>
+      <td>throttleRedraw</td>
+      <td>number</td>
+      <td><code>0</code></td>
+      <td>Limit the maximum number of redraws to once every x milliseconds. For example setting throttleRedraw to `100` milliseconds will limit the number of redraws to 10 times per second.</td>
+    </tr>
+
     <tr class='toggle collapsible' onclick="toggleTable('optionTable','timeAxis', this);">
       <td><span parent="timeAxis" class="right-caret"></span> timeAxis</td>
       <td>Object</td>
@@ -956,13 +963,6 @@ function (option, path) {
       </td>
     </tr>
 
-    <tr parent="timeAxis" class="hidden">
-      <td class="indent">throttleRedraw</td>
-      <td>number</td>
-      <td><code>0</code></td>
-      <td>Limit the maximum number of redraws to once every x milliseconds. For example setting throttleRedraw to `100` milliseconds will limit the number of redraws to 10 times per second.</td>
-    </tr>
-
     <tr parent="timeAxis" class="hidden">
       <td class="indent">timeAxis.step</td>
       <td>number</td>

examples/network/exampleUtil.js

@@ -66,5 +66,61 @@ function getScaleFreeNetwork(nodeCount) {
     }
   }
 
+  return {nodes:nodes, edges:edges};
+}
+
+var randomSeed = 764; // Math.round(Math.random()*1000);
+function seededRandom() {
+  var x = Math.sin(randomSeed++) * 10000;
+  return x - Math.floor(x);
+}
+
+function getScaleFreeNetworkSeeded(nodeCount) {
+  var nodes = [];
+  var edges = [];
+  var connectionCount = [];
+
+  // randomly create some nodes and edges
+  for (var i = 0; i < nodeCount; i++) {
+    nodes.push({
+      id: i,
+      label: String(i)
+    });
+
+    connectionCount[i] = 0;
+
+    // create edges in a scale-free-network way
+    if (i == 1) {
+      var from = i;
+      var to = 0;
+      edges.push({
+        from: from,
+        to: to
+      });
+      connectionCount[from]++;
+      connectionCount[to]++;
+    }
+    else if (i > 1) {
+      var conn = edges.length * 2;
+      var rand = Math.floor(seededRandom() * conn);
+      var cum = 0;
+      var j = 0;
+      while (j < connectionCount.length && cum < rand) {
+        cum += connectionCount[j];
+        j++;
+      }
+
+
+      var from = i;
+      var to = j;
+      edges.push({
+        from: from,
+        to: to
+      });
+      connectionCount[from]++;
+      connectionCount[to]++;
+    }
+  }
+
   return {nodes:nodes, edges:edges};
 }

index.html

@@ -28,7 +28,7 @@
 
     <script src="./js/smooth-scroll.min.js"></script>
 
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.8.0/vis.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.8.1/vis.min.js"></script>
 
     <script language="JavaScript">
         smoothScroll.init();
@@ -36,7 +36,7 @@
         function evalLinks() {
             if (typeof vis === 'undefined') {
                 console.log(document.getElementById("linkStatus"));
-                document.getElementById("linkStatus").innerHTML = "Note: The latest version (4.8.0) is not yet available on cdnjs, <a href='https://cdnjs.com/libraries/vis'>click here</a> to to pick the latest available version.<br />";
+                document.getElementById("linkStatus").innerHTML = "Note: The latest version (4.8.1) is not yet available on cdnjs, <a href='https://cdnjs.com/libraries/vis'>click here</a> to to pick the latest available version.<br />";
                 document.getElementById("cdn_vis").style.color = "rgb(150,150,150)";
                 document.getElementById("cdn_vis_css").style.color = "rgb(150,150,150)";
             }
@@ -196,13 +196,13 @@
                     <pre class="prettyprint">bower install vis</pre>
                     <h3>link from cdnjs.com</h3>
                     <p>
-                        <a id="cdn_vis" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.8.0/vis.min.js" target="_blank">vis.min.js</a> <br>
-                        <a id="cdn_vis_css" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.8.0/vis.min.css" target="_blank">vis.min.css</a> <br>
+                        <a id="cdn_vis" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.8.1/vis.min.js" target="_blank">vis.min.js</a> <br>
+                        <a id="cdn_vis_css" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.8.1/vis.min.css" target="_blank">vis.min.css</a> <br>
                         <span id="linkStatus"></span>
                     </p>
                     <h3>download</h3>
                     <p>
-                        <a href="download/vis.zip">vis.zip (version <span class="version">4.8.0</span>)</a>
+                        <a href="download/vis.zip">vis.zip (version <span class="version">4.8.1</span>)</a>
                     </p>
                 </div>
             </div>