Released version 4.5.1

dist/vis.js

@@ -4,8 +4,8 @@
  *
  * A dynamic, browser-based visualization library.
  *
- * @version 4.5.0
- * @date    2015-07-17
+ * @version 4.5.1
+ * @date    2015-07-20
  *
  * @license
  * Copyright (C) 2011-2014 Almende B.V, http://almende.com
@@ -27428,6 +27428,8 @@ return /******/ (function(modules) { // webpackBootstrap
     }, {
       key: 'refresh',
       value: function refresh() {
+        var clearPositions = arguments.length <= 0 || arguments[0] === undefined ? false : arguments[0];
+
         var nodes = this.body.nodes;
         for (var nodeId in nodes) {
           var node = undefined;
@@ -27436,7 +27438,10 @@ return /******/ (function(modules) { // webpackBootstrap
           }
           var data = this.body.data.nodes._data[nodeId];
           if (node !== undefined && data !== undefined) {
-            node.setOptions({ fixed: false, x: null, y: null });
+            if (clearPositions === true) {
+              node.setOptions({ x: null, y: null });
+            }
+            node.setOptions({ fixed: false });
             node.setOptions(data);
           }
         }
@@ -34389,33 +34394,14 @@ return /******/ (function(modules) { // webpackBootstrap
             if (this.body.edges[edgeId] !== undefined) {
               var edge = this.body.edges[edgeId];
 
-              // if the edge is a clusterEdge, we delete it. The opening of the clusters will restore these edges when required.
-              if (edgeId.substr(0, 12) === 'clusterEdge:') {
-                // we only delete the cluster edge if there is another edge to the node that is not a cluster.
-                var target = edge.from.isCluster === true ? edge.toId : edge.fromId;
-                var deleteEdge = false;
-
-                // search the contained edges for an edge that has a link to the targetNode
-                for (var edgeId2 in childEdgesObj) {
-                  if (childEdgesObj.hasOwnProperty(edgeId2)) {
-                    if (this.body.edges[edgeId2] !== undefined && edgeId2 !== edgeId) {
-                      var edge2 = this.body.edges[edgeId2];
-                      if (edge2.fromId == target || edge2.toId == target) {
-                        deleteEdge = true;
-                        break;
-                      }
-                    }
-                  }
-                }
-
-                // if we found the edge that will trigger the recreation of a new cluster edge on opening, we can delete this edge.
-                if (deleteEdge === true) {
-                  edge.edgeType.cleanup();
-                  // this removes the edge from node.edges, which is why edgeIds is formed
-                  edge.disconnect();
-                  delete childEdgesObj[edgeId];
-                  delete this.body.edges[edgeId];
-                }
+              // if this is a cluster edge that is fully encompassed in the cluster, we want to delete it
+              // this check verifies that both of the connected nodes are in this cluster
+              if (edgeId.substr(0, 12) === 'clusterEdge:' && childNodesObj[edge.fromId] !== undefined && childNodesObj[edge.toId] !== undefined) {
+                edge.edgeType.cleanup();
+                // this removes the edge from node.edges, which is why edgeIds is formed
+                edge.disconnect();
+                delete childEdgesObj[edgeId];
+                delete this.body.edges[edgeId];
               } else {
                 edge.togglePhysics(false);
                 edge.options.hidden = true;
@@ -34718,8 +34704,8 @@ return /******/ (function(modules) { // webpackBootstrap
         average = average / hubCounter;
         averageSquared = averageSquared / hubCounter;
 
-        var letiance = averageSquared - Math.pow(average, 2);
-        var standardDeviation = Math.sqrt(letiance);
+        var variance = averageSquared - Math.pow(average, 2);
+        var standardDeviation = Math.sqrt(variance);
 
         var hubThreshold = Math.floor(average + 2 * standardDeviation);
 
@@ -37980,7 +37966,7 @@ return /******/ (function(modules) { // webpackBootstrap
           if (this.options.hierarchical.enabled === true) {
             if (prevHierarchicalState === true) {
               // refresh the overridden options for nodes and edges.
-              this.body.emitter.emit('refresh');
+              this.body.emitter.emit('refresh', true);
             }
 
             // make sure the level seperation is the right way up
@@ -38650,7 +38636,7 @@ return /******/ (function(modules) { // webpackBootstrap
 
           // remove buttons
           if (selectedTotalCount !== 0) {
-            if (selectedNodeCount === 1 && this.options.deleteNode !== false) {
+            if (selectedNodeCount > 0 && this.options.deleteNode !== false) {
               if (needSeperator === true) {
                 this._createSeperator(4);
               }

docs/graph2d/index.html

@@ -145,7 +145,6 @@
 
     <h2 id="Contents">Contents</h2>
     <ul>
-        <li><a href="#Overview">Overview</a></li>
         <li><a href="#Data_Format">Data Format</a>
             <ul>
                 <li><a href="#items">Items</a></li>
@@ -227,7 +226,7 @@
             Options is a name-value map in the JSON format. The available options
             are described in section <a href="#Configuration_Options">Configuration Options</a>.
             Groups is a vis <code>DataSet</code> containing groups. The available options and the method of construction
-            are described in section <a href="#Group_Options">Data Format</a>.
+            are described in section <a href="#Data_Format">Data Format</a>.
         </p>
         <pre class="prettyprint lang-js options">var graph = new vis.Graph2d(container [, data] [, groups] [, options]);</pre>
         For backwards compatibility, groups and options can be interchanged.
@@ -245,7 +244,7 @@
 
     <h2 id="Data_Format">Data Format</h2>
     <p>
-        Graph2d can load data from an <code>Array</code>, a <code>DataSet</code> or a <code>DataView</code>.
+        Graph2d can load data from an <code>Array</code>, a <code>DataSet</code> (offering 2 way data binding), or a <code>DataView</code> (offering one way data binding).
         Objects are added to this DataSet by using the <code>add()</code> function.
         Data points must have properties <code>x</code>, <code>y</code>, and <code>z</code>,
         and can optionally have a property <code>style</code> and <code>filter</code>.

docs/graph3d/index.html

@@ -199,7 +199,7 @@
 
   <h2 id="Data_Format">Data Format</h2>
   <p>
-    Graph3d can load data from an <code>Array</code>, a <code>DataSet</code> or a <code>DataView</code>.
+    Graph3d can load data from an <code>Array</code>, a <code>DataSet</code> (offering 2 way data binding), or a <code>DataView</code> (offering 1 way data binding).
     JSON objects are added to this DataSet by using the <code>add()</code> function.
     Data points must have properties <code>x</code>, <code>y</code>, and <code>z</code>,
     and can optionally have a property <code>style</code> and <code>filter</code>.

docs/timeline/index.html

@@ -209,19 +209,20 @@
 
   <h3 id="items">Items</h3>
   <p>
-    The Timeline uses regular Arrays and Objects as data format.
-    Data items can contain the properties <code>start</code>,
+    For items, the Timeline accepts an Array, a DataSet (offering 2 way data binding),
+    or a DataView (offering 1 way data binding).
+    Items are regular objects and can contain the properties <code>start</code>,
     <code>end</code> (optional), <code>content</code>,
     <code>group</code> (optional), <code>className</code> (optional), 
     <code>editable</code> (optional), and <code>style</code> (optional).
   </p>
 
   <p>
-    A table is constructed as:
+    A DataSet is constructed as:
   </p>
 
 <pre class="prettyprint lang-js">
-var items = [
+var items = new vis.DataSet([
   {
     start: new Date(2010, 7, 15),
     end: new Date(2010, 8, 2),  // end is optional
@@ -343,7 +344,9 @@ var items = [
 
   <h3 id="groups">Groups</h3>
   <p>
-    Like the items, groups are regular JavaScript Arrays and Objects.
+    For the items, groups can be an Array, a DataSet (offering 2 way data binding),
+    or a DataView (offering 1 way data binding).
+
     Using groups, items can be grouped together.
     Items are filtered per group, and displayed as
 
@@ -1120,9 +1123,9 @@ document.getElementById('myTimeline').onclick = function (event) {
       <td>none</td>
       <td>Set both groups and items at once. Both properties are optional. This is a convenience method for individually calling both <code>setItems(items)</code> and <code>setGroups(groups)</code>.
         Both <code>items</code> and <code>groups</code> can be an Array with Objects,
-        a DataSet, or a DataView. For each of the groups, the items of the
-        timeline are filtered on the property <code>group</code>, which
-        must correspond with the id of the group.
+        a DataSet (offering 2 way data binding), or a DataView (offering 1 way data binding).
+        For each of the groups, the items of the timeline are filtered on the
+        property <code>group</code>, which must correspond with the id of the group.
       </td>
     </tr>
 
@@ -1131,9 +1134,9 @@ document.getElementById('myTimeline').onclick = function (event) {
       <td>none</td>
       <td>Set a data set with groups for the Timeline.
         <code>groups</code> can be an Array with Objects,
-        a DataSet, or a DataView. For each of the groups, the items of the
-        timeline are filtered on the property <code>group</code>, which
-        must correspond with the id of the group.
+        a DataSet (offering 2 way data binding), or a DataView (offering 1 way data binding).
+        For each of the groups, the items of the timeline are filtered on the
+        property <code>group</code>, which must correspond with the id of the group.
       </td>
     </tr>
 
@@ -1142,7 +1145,7 @@ document.getElementById('myTimeline').onclick = function (event) {
       <td>none</td>
       <td>Set a data set with items for the Timeline.
         <code>items</code> can be an Array with Objects,
-        a DataSet, or a DataView.
+        a DataSet (offering 2 way data binding), or a DataView (offering 1 way data binding).
       </td>
     </tr>
 

index.html

@@ -28,7 +28,7 @@
 
     <script src="./js/smooth-scroll.min.js"></script>
 
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.5.0/vis.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.5.1/vis.min.js"></script>
 
     <script language="JavaScript">
         smoothScroll.init();
@@ -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.5.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.5.0/vis.min.css" target="_blank">vis.min.css</a> <br>
+                        <a id="cdn_vis" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.5.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.5.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.5.0</span>)</a>
+                        <a href="download/vis.zip">vis.zip (version <span class="version">4.5.1</span>)</a>
                     </p>
                 </div>
             </div>