Released version 0.6.1

dist/vis.css

@@ -143,7 +143,8 @@
   background: none;
 }
 
-.vis.timeline .dot {
+.vis.timeline .dot,
+.vis.timeline .item.dot {
   padding: 0;
   border: 5px solid #97B0F8;
   position: absolute;

dist/vis.js

@@ -4,8 +4,8 @@
  *
  * A dynamic, browser-based visualization library.
  *
- * @version 0.6.0
- * @date    2014-03-05
+ * @version 0.6.1
+ * @date    2014-03-06
  *
  * @license
  * Copyright (C) 2011-2014 Almende B.V, http://almende.com
@@ -5504,8 +5504,8 @@ ItemSet.prototype.getAxis = function getAxis() {
 ItemSet.prototype.reflow = function reflow () {
   var changed = 0,
       options = this.options,
-      marginAxis = options.margin && options.margin.axis || this.defaultOptions.margin.axis,
-      marginItem = options.margin && options.margin.item || this.defaultOptions.margin.item,
+      marginAxis = (options.margin && 'axis' in options.margin) ? options.margin.axis : this.defaultOptions.margin.axis,
+      marginItem = (options.margin && 'item' in options.margin) ? options.margin.item : this.defaultOptions.margin.item,
       update = util.updateProperty,
       asNumber = util.option.asNumber,
       asSize = util.option.asSize,
@@ -10645,14 +10645,21 @@ Edge.prototype._drawLine = function(ctx) {
   ctx.strokeStyle = this.color;
   ctx.lineWidth = this._getLineWidth();
 
-  var point;
   if (this.from != this.to) {
     // draw line
     this._line(ctx);
 
     // draw label
+    var point;
     if (this.label) {
-      point = this._pointOnLine(0.5);
+      if (this.smooth == true) {
+        var midpointX = 0.5*(0.5*(this.from.x + this.via.x) + 0.5*(this.to.x + this.via.x));
+        var midpointY = 0.5*(0.5*(this.from.y + this.via.y) + 0.5*(this.to.y + this.via.y));
+        point = {x:midpointX, y:midpointY};
+      }
+      else {
+        point = this._pointOnLine(0.5);
+      }
       this._label(ctx, this.label, point.x, point.y);
     }
   }
@@ -10835,7 +10842,15 @@ Edge.prototype._drawDashLine = function(ctx) {
 
   // draw label
   if (this.label) {
-    var point = this._pointOnLine(0.5);
+    var point;
+    if (this.smooth == true) {
+      var midpointX = 0.5*(0.5*(this.from.x + this.via.x) + 0.5*(this.to.x + this.via.x));
+      var midpointY = 0.5*(0.5*(this.from.y + this.via.y) + 0.5*(this.to.y + this.via.y));
+      point = {x:midpointX, y:midpointY};
+    }
+    else {
+      point = this._pointOnLine(0.5);
+    }
     this._label(ctx, this.label, point.x, point.y);
   }
 };
@@ -10906,7 +10921,6 @@ Edge.prototype._drawArrowCenter = function(ctx) {
 
     // draw label
     if (this.label) {
-      point = this._pointOnLine(0.5);
       this._label(ctx, this.label, point.x, point.y);
     }
   }
@@ -11010,7 +11024,15 @@ Edge.prototype._drawArrow = function(ctx) {
 
     // draw label
     if (this.label) {
-      var point = this._pointOnLine(0.5);
+      var point;
+      if (this.smooth == true) {
+        var midpointX = 0.5*(0.5*(this.from.x + this.via.x) + 0.5*(this.to.x + this.via.x));
+        var midpointY = 0.5*(0.5*(this.from.y + this.via.y) + 0.5*(this.to.y + this.via.y));
+        point = {x:midpointX, y:midpointY};
+      }
+      else {
+        point = this._pointOnLine(0.5);
+      }
       this._label(ctx, this.label, point.x, point.y);
     }
   }
@@ -11674,6 +11696,7 @@ var physicsMixin = {
    */
   _loadPhysicsConfiguration : function() {
     if (this.physicsConfiguration === undefined) {
+      var hierarchicalLayoutDirections = ["LR","RL","UD","DU"];
       this.physicsConfiguration = document.createElement('div');
       this.physicsConfiguration.className = "PhysicsConfiguration";
       this.physicsConfiguration.innerHTML = '' +
@@ -11687,127 +11710,109 @@ var physicsMixin = {
         '<table id="graph_BH_table" style="display:none">'+
         '<tr><td><b>Barnes Hut</b></td></tr>'+
         '<tr>'+
-        '<td width="150px">gravitationalConstant</td><td>0</td><td><input type="range" min="500" max="20000" value="2000" step="25" style="width:300px" id="graph_BH_gc"></td><td  width="50px">-20000</td><td><input value="-2000" id="graph_BH_gc_value" style="width:60px"></td>'+
+        '<td width="150px">gravitationalConstant</td><td>0</td><td><input type="range" min="500" max="20000" value="' + (-1* this.constants.physics.barnesHut.gravitationalConstant) + '" step="25" style="width:300px" id="graph_BH_gc"></td><td  width="50px">-20000</td><td><input value="' + (-1* this.constants.physics.barnesHut.gravitationalConstant) + '" id="graph_BH_gc_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">centralGravity</td><td>0</td><td><input type="range" min="0" max="3"  value="0.3" step="0.05"  style="width:300px" id="graph_BH_cg"></td><td>3</td><td><input value="0.03" id="graph_BH_cg_value" style="width:60px"></td>'+
+        '<td width="150px">centralGravity</td><td>0</td><td><input type="range" min="0" max="3"  value="' + this.constants.physics.barnesHut.centralGravity + '" step="0.05"  style="width:300px" id="graph_BH_cg"></td><td>3</td><td><input value="' + this.constants.physics.barnesHut.centralGravity + '" id="graph_BH_cg_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">springLength</td><td>0</td><td><input type="range" min="0" max="500" value="100" step="1" style="width:300px" id="graph_BH_sl"></td><td>500</td><td><input value="100" id="graph_BH_sl_value" style="width:60px"></td>'+
+        '<td width="150px">springLength</td><td>0</td><td><input type="range" min="0" max="500" value="' + this.constants.physics.barnesHut.springLength + '" step="1" style="width:300px" id="graph_BH_sl"></td><td>500</td><td><input value="' + this.constants.physics.barnesHut.springLength + '" id="graph_BH_sl_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">springConstant</td><td>0</td><td><input type="range" min="0" max="0.5" value="0.05" step="0.005" style="width:300px" id="graph_BH_sc"></td><td>0.5</td><td><input value="0.05" id="graph_BH_sc_value" style="width:60px"></td>'+
+        '<td width="150px">springConstant</td><td>0</td><td><input type="range" min="0" max="0.5" value="' + this.constants.physics.barnesHut.springConstant + '" step="0.001" style="width:300px" id="graph_BH_sc"></td><td>0.5</td><td><input value="' + this.constants.physics.barnesHut.springConstant + '" id="graph_BH_sc_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">damping</td><td>0</td><td><input type="range" min="0" max="0.3" value="0.09" step="0.005" style="width:300px" id="graph_BH_damp"></td><td>0.3</td><td><input value="0.09" id="graph_BH_damp_value" style="width:60px"></td>'+
+        '<td width="150px">damping</td><td>0</td><td><input type="range" min="0" max="0.3" value="' + this.constants.physics.barnesHut.damping + '" step="0.005" style="width:300px" id="graph_BH_damp"></td><td>0.3</td><td><input value="' + this.constants.physics.barnesHut.damping + '" id="graph_BH_damp_value" style="width:60px"></td>'+
         '</tr>'+
         '</table>'+
         '<table id="graph_R_table" style="display:none">'+
         '<tr><td><b>Repulsion</b></td></tr>'+
         '<tr>'+
-        '<td width="150px">nodeDistance</td><td>0</td><td><input type="range" min="0" max="300" value="100" step="1" style="width:300px" id="graph_R_nd"></td><td width="50px">300</td><td><input value="100" id="graph_R_nd_value" style="width:60px"></td>'+
+        '<td width="150px">nodeDistance</td><td>0</td><td><input type="range" min="0" max="300" value="' + this.constants.physics.repulsion.nodeDistance + '" step="1" style="width:300px" id="graph_R_nd"></td><td width="50px">300</td><td><input value="' + this.constants.physics.repulsion.nodeDistance + '" id="graph_R_nd_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">centralGravity</td><td>0</td><td><input type="range" min="0" max="3"  value="0.1" step="0.05"  style="width:300px" id="graph_R_cg"></td><td>3</td><td><input value="0.01" id="graph_R_cg_value" style="width:60px"></td>'+
+        '<td width="150px">centralGravity</td><td>0</td><td><input type="range" min="0" max="3"  value="' + this.constants.physics.repulsion.centralGravity + '" step="0.05"  style="width:300px" id="graph_R_cg"></td><td>3</td><td><input value="' + this.constants.physics.repulsion.centralGravity + '" id="graph_R_cg_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">springLength</td><td>0</td><td><input type="range" min="0" max="500" value="200" step="1" style="width:300px" id="graph_R_sl"></td><td>500</td><td><input value="200" id="graph_R_sl_value" style="width:60px"></td>'+
+        '<td width="150px">springLength</td><td>0</td><td><input type="range" min="0" max="500" value="' + this.constants.physics.repulsion.springLength + '" step="1" style="width:300px" id="graph_R_sl"></td><td>500</td><td><input value="' + this.constants.physics.repulsion.springLength + '" id="graph_R_sl_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">springConstant</td><td>0</td><td><input type="range" min="0" max="0.5" value="0.05" step="0.005" style="width:300px" id="graph_R_sc"></td><td>0.5</td><td><input value="0.05" id="graph_R_sc_value" style="width:60px"></td>'+
+        '<td width="150px">springConstant</td><td>0</td><td><input type="range" min="0" max="0.5" value="' + this.constants.physics.repulsion.springConstant + '" step="0.001" style="width:300px" id="graph_R_sc"></td><td>0.5</td><td><input value="' + this.constants.physics.repulsion.springConstant + '" id="graph_R_sc_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">damping</td><td>0</td><td><input type="range" min="0" max="0.3" value="0.09" step="0.005" style="width:300px" id="graph_R_damp"></td><td>0.3</td><td><input value="0.09" id="graph_R_damp_value" style="width:60px"></td>'+
+        '<td width="150px">damping</td><td>0</td><td><input type="range" min="0" max="0.3" value="' + this.constants.physics.repulsion.damping + '" step="0.005" style="width:300px" id="graph_R_damp"></td><td>0.3</td><td><input value="' + this.constants.physics.repulsion.damping + '" id="graph_R_damp_value" style="width:60px"></td>'+
         '</tr>'+
         '</table>'+
         '<table id="graph_H_table" style="display:none">'+
         '<tr><td width="150"><b>Hierarchical</b></td></tr>'+
         '<tr>'+
-        '<td width="150px">nodeDistance</td><td>0</td><td><input type="range" min="0" max="300" value="60" step="1" style="width:300px" id="graph_H_nd"></td><td width="50px">300</td><td><input value="60" id="graph_H_nd_value" style="width:60px"></td>'+
+        '<td width="150px">nodeDistance</td><td>0</td><td><input type="range" min="0" max="300" value="' + this.constants.physics.hierarchicalRepulsion.nodeDistance + '" step="1" style="width:300px" id="graph_H_nd"></td><td width="50px">300</td><td><input value="' + this.constants.physics.hierarchicalRepulsion.nodeDistance + '" id="graph_H_nd_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">centralGravity</td><td>0</td><td><input type="range" min="0" max="3"  value="0" step="0.05"  style="width:300px" id="graph_H_cg"></td><td>3</td><td><input value="0" id="graph_H_cg_value" style="width:60px"></td>'+
+        '<td width="150px">centralGravity</td><td>0</td><td><input type="range" min="0" max="3"  value="' + this.constants.physics.hierarchicalRepulsion.centralGravity + '" step="0.05"  style="width:300px" id="graph_H_cg"></td><td>3</td><td><input value="' + this.constants.physics.hierarchicalRepulsion.centralGravity + '" id="graph_H_cg_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">springLength</td><td>0</td><td><input type="range" min="0" max="500" value="100" step="1" style="width:300px" id="graph_H_sl"></td><td>500</td><td><input value="100" id="graph_H_sl_value" style="width:60px"></td>'+
+        '<td width="150px">springLength</td><td>0</td><td><input type="range" min="0" max="500" value="' + this.constants.physics.hierarchicalRepulsion.springLength + '" step="1" style="width:300px" id="graph_H_sl"></td><td>500</td><td><input value="' + this.constants.physics.hierarchicalRepulsion.springLength + '" id="graph_H_sl_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">springConstant</td><td>0</td><td><input type="range" min="0" max="0.5" value="0.01" step="0.005" style="width:300px" id="graph_H_sc"></td><td>0.5</td><td><input value="0.01" id="graph_H_sc_value" style="width:60px"></td>'+
+        '<td width="150px">springConstant</td><td>0</td><td><input type="range" min="0" max="0.5" value="' + this.constants.physics.hierarchicalRepulsion.springConstant + '" step="0.001" style="width:300px" id="graph_H_sc"></td><td>0.5</td><td><input value="' + this.constants.physics.hierarchicalRepulsion.springConstant + '" id="graph_H_sc_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">damping</td><td>0</td><td><input type="range" min="0" max="0.3" value="0.09" step="0.005" style="width:300px" id="graph_H_damp"></td><td>0.3</td><td><input value="0.09" id="graph_H_damp_value" style="width:60px"></td>'+
+        '<td width="150px">damping</td><td>0</td><td><input type="range" min="0" max="0.3" value="' + this.constants.physics.hierarchicalRepulsion.damping + '" step="0.005" style="width:300px" id="graph_H_damp"></td><td>0.3</td><td><input value="' + this.constants.physics.hierarchicalRepulsion.damping + '" id="graph_H_damp_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">direction</td><td>1</td><td><input type="range" min="0" max="3" value="0" step="1" style="width:300px" id="graph_H_direction"></td><td>4</td><td><input value="LR" id="graph_H_direction_value" style="width:60px"></td>'+
+        '<td width="150px">direction</td><td>1</td><td><input type="range" min="0" max="3" value="' + hierarchicalLayoutDirections.indexOf(this.constants.hierarchicalLayout.direction) + '" step="1" style="width:300px" id="graph_H_direction"></td><td>4</td><td><input value="' + this.constants.hierarchicalLayout.direction + '" id="graph_H_direction_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">levelSeparation</td><td>1</td><td><input type="range" min="0" max="500" value="150" step="1" style="width:300px" id="graph_H_levsep"></td><td>500</td><td><input value="150" id="graph_H_levsep_value" style="width:60px"></td>'+
+        '<td width="150px">levelSeparation</td><td>1</td><td><input type="range" min="0" max="' + this.constants.hierarchicalLayout.levelSeparation + '" value="150" step="1" style="width:300px" id="graph_H_levsep"></td><td>500</td><td><input value="' + this.constants.hierarchicalLayout.levelSeparation + '" id="graph_H_levsep_value" style="width:60px"></td>'+
         '</tr>'+
         '<tr>'+
-        '<td width="150px">nodeSpacing</td><td>1</td><td><input type="range" min="0" max="500" value="100" step="1" style="width:300px" id="graph_H_nspac"></td><td>500</td><td><input value="100" id="graph_H_nspac_value" style="width:60px"></td>'+
+        '<td width="150px">nodeSpacing</td><td>1</td><td><input type="range" min="0" max="' + this.constants.hierarchicalLayout.nodeSpacing + '" value="100" step="1" style="width:300px" id="graph_H_nspac"></td><td>500</td><td><input value="' + this.constants.hierarchicalLayout.nodeSpacing + '" id="graph_H_nspac_value" style="width:60px"></td>'+
         '</tr>'+
         '</table>'
       this.containerElement.parentElement.insertBefore(this.physicsConfiguration,this.containerElement);
 
 
-      var hierarchicalLayoutDirections = ["LR","RL","UD","DU"];
+
       var rangeElement;
       rangeElement = document.getElementById('graph_BH_gc');
-      rangeElement.innerHTML = this.constants.physics.barnesHut.gravitationalConstant;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_BH_gc',-1,"physics_barnesHut_gravitationalConstant");
       rangeElement = document.getElementById('graph_BH_cg');
-      rangeElement.innerHTML = this.constants.physics.barnesHut.centralGravity;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_BH_cg',1,"physics_centralGravity");
       rangeElement = document.getElementById('graph_BH_sc');
-      rangeElement.innerHTML = this.constants.physics.barnesHut.springConstant;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_BH_sc',1,"physics_springConstant");
       rangeElement = document.getElementById('graph_BH_sl');
-      rangeElement.innerHTML = this.constants.physics.barnesHut.springLength;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_BH_sl',1,"physics_springLength");
       rangeElement = document.getElementById('graph_BH_damp');
-      rangeElement.innerHTML = this.constants.physics.barnesHut.damping;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_BH_damp',1,"physics_damping");
 
 
       rangeElement = document.getElementById('graph_R_nd');
-      rangeElement.innerHTML = this.constants.physics.repulsion.nodeDistance;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_R_nd',1,"physics_repulsion_nodeDistance");
       rangeElement = document.getElementById('graph_R_cg');
-      rangeElement.innerHTML = this.constants.physics.repulsion.centralGravity;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_R_cg',1,"physics_centralGravity");
       rangeElement = document.getElementById('graph_R_sc');
-      rangeElement.innerHTML = this.constants.physics.repulsion.springConstant;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_R_sc',1,"physics_springConstant");
       rangeElement = document.getElementById('graph_R_sl');
-      rangeElement.innerHTML = this.constants.physics.repulsion.springLength;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_R_sl',1,"physics_springLength");
       rangeElement = document.getElementById('graph_R_damp');
-      rangeElement.innerHTML = this.constants.physics.repulsion.damping;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_R_damp',1,"physics_damping");
 
       rangeElement = document.getElementById('graph_H_nd');
-      rangeElement.innerHTML = this.constants.physics.hierarchicalRepulsion.nodeDistance;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_H_nd',1,"physics_hierarchicalRepulsion_nodeDistance");
       rangeElement = document.getElementById('graph_H_cg');
-      rangeElement.innerHTML = this.constants.physics.hierarchicalRepulsion.centralGravity;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_H_cg',1,"physics_centralGravity");
       rangeElement = document.getElementById('graph_H_sc');
-      rangeElement.innerHTML = this.constants.physics.hierarchicalRepulsion.springConstant;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_H_sc',1,"physics_springConstant");
       rangeElement = document.getElementById('graph_H_sl');
-      rangeElement.innerHTML = this.constants.physics.hierarchicalRepulsion.springLength;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_H_sl',1,"physics_springLength");
       rangeElement = document.getElementById('graph_H_damp');
-      rangeElement.innerHTML = this.constants.physics.hierarchicalRepulsion.damping;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_H_damp',1,"physics_damping");
       rangeElement = document.getElementById('graph_H_direction');
-      rangeElement.innerHTML = hierarchicalLayoutDirections.indexOf(this.constants.hierarchicalLayout.direction);
       rangeElement.onchange = showValueOfRange.bind(this,'graph_H_direction',hierarchicalLayoutDirections,"hierarchicalLayout_direction");
       rangeElement = document.getElementById('graph_H_levsep');
-      rangeElement.innerHTML = this.constants.hierarchicalLayout.levelSeparation;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_H_levsep',1,"hierarchicalLayout_levelSeparation");
       rangeElement = document.getElementById('graph_H_nspac');
-      rangeElement.innerHTML = this.constants.hierarchicalLayout.nodeSpacing;
       rangeElement.onchange = showValueOfRange.bind(this,'graph_H_nspac',1,"hierarchicalLayout_nodeSpacing");
 
       var radioButton1 = document.getElementById("graph_physicsMethod1");
@@ -16150,8 +16155,6 @@ Graph.prototype.zoomExtent = function(initialZoom, disableStart) {
   }
 
 
-
-  this.pinch.mousewheelScale = zoomLevel;
   this._setScale(zoomLevel);
   this._centerGraph(range);
   if (disableStart == false) {
@@ -16753,7 +16756,6 @@ Graph.prototype._zoom = function(scale, pointer) {
   this.areaCenter = {"x" : this._canvasToX(pointer.x),
                      "y" : this._canvasToY(pointer.y)};
 
-  this.pinch.mousewheelScale = scale;
   this._setScale(scale);
   this._setTranslation(tx, ty);
   this.updateClustersDefault();
@@ -16785,12 +16787,9 @@ Graph.prototype._onMouseWheel = function(event) {
   // Basically, delta is now positive if wheel was scrolled up,
   // and negative, if wheel was scrolled down.
   if (delta) {
-    if (!('mousewheelScale' in this.pinch)) {
-      this.pinch.mousewheelScale = 1;
-    }
 
     // calculate the new scale
-    var scale = this.pinch.mousewheelScale;
+    var scale = this._getScale();
     var zoom = delta / 10;
     if (delta < 0) {
       zoom = zoom / (1 - zoom);
@@ -16803,9 +16802,6 @@ Graph.prototype._onMouseWheel = function(event) {
 
     // apply the new scale
     this._zoom(scale, pointer);
-
-    // store the new, applied scale -- this is now done in _zoom
-//    this.pinch.mousewheelScale = scale;
   }
 
   // Prevent default actions caused by mouse wheel.
@@ -17578,6 +17574,10 @@ Graph.prototype._animationStep = function() {
   this.renderTime = Date.now() - renderTime;
 };
 
+if (typeof window !== 'undefined') {
+  window.requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame ||
+                                 window.webkitRequestAnimationFrame || window.msRequestAnimationFrame;
+}
 
 /**
  * Schedule a animation step with the refreshrate interval.
@@ -17586,8 +17586,8 @@ Graph.prototype._animationStep = function() {
  */
 Graph.prototype.start = function() {
   if (this.moving || this.xIncrement != 0 || this.yIncrement != 0 || this.zoomIncrement != 0) {
-    if (!this.timer) {
-      this.timer = window.setTimeout(this._animationStep.bind(this), this.renderTimestep); // wait this.renderTimeStep milliseconds and perform the animation step function
+    if (!this.timer) { 
+      this.timer = window.requestAnimationFrame(this._animationStep.bind(this), this.renderTimestep); // wait this.renderTimeStep milliseconds and perform the animation step function
     }
   }
   else {

docs/css/style.css

@@ -75,3 +75,8 @@ td {
   padding: 5px;
   vertical-align: top;
 }
+
+p.important_note {
+  color: #3a6baa;
+    font-weight:bold;
+}

docs/graph.html

@@ -1185,6 +1185,8 @@ var nodes = [
     and the edges were modelled as springs. The new system employed the <a href="http://en.wikipedia.org/wiki/Barnes%E2%80%93Hut_simulation">Barnes-Hut</a> gravitational simulation model. The edges are still modelled as springs.
     To unify the physics system, the damping, repulsion distance and edge length have been combined in an physics option. To retain good behaviour, both the old repulsion model and the Barnes-Hut model have their own parameters.
     If no options for the physics system are supplied, the Barnes-Hut method will be used with the default parameters. If you want to customize the physics system easily, you can use the configurePhysics option.
+
+<p class="important_note">Note: if the behaviour of your graph is not the way you want it, use configurePhysics as described <u><a href="#PhysicsConfiguration">below</a></u> or by <u><a href="../examples/graph/25_physics_configuration.html">example 25</a></u>.</p>
 </p>
 <pre class="prettyprint">
 // These variables must be defined in an options object named physics.
@@ -1296,7 +1298,17 @@ var options = {
         <td>This is the damping constant. It is used to dissipate energy from the system to have it settle in an equilibrium. More information is available <a href="http://en.wikipedia.org/wiki/Damping" target="_blank">here</a>.</td>
     </tr>
 </table>
+<h4 id="PhysicsConfiguration">Configuration:</h5>
+Every dataset is different. Nodes can have different sizes based on content, interconnectivity can be high or low etc. Because of this, graph has a special option
+that the user can use to explore which settings may be good for him or her. This is ment to be used during the development phase when you are implementing vis.js. Once you have found
+settings you are happy with, you can supply them to graph using the physics options as described above.
 
+On start, the default settings will be loaded. Keep in mind that selecting the hierarchical simulation mode <b>disables</b> smooth curves. These will not be enabled again afterwards.
+<pre class="prettyprint">
+var options = {
+    configurePhysics:true
+}
+</pre>
 <h3 id="Data_manipulation">Data manipulation</h3>
 <p>
     By using the data manipulation feature of the graph you can dynamically create nodes, connect nodes with edges, edit nodes or delete nodes and edges.

examples/graph/22_les_miserables.html

@@ -359,7 +359,6 @@
             var data = {
                 nodes: nodes,
                 edges: edges
-
             };
             var options = {nodes: {shape:'circle'},stabilize: false};
             var graph = new vis.Graph(container, data, options);

examples/graph/graphviz/graphviz_gallery.html

@@ -65,7 +65,7 @@
 <script type="text/javascript">
   var container = document.getElementById('mygraph');
   var url = document.getElementById('url');
-  var graph = new vis.Graph(container);
+  var graph = new vis.Graph(container,{},{physics:{barnesHut:{springLength:75,springConstant:0.015}}});
 
   function loadData () {
     $.ajax({

index.html

@@ -73,7 +73,7 @@ bower install vis
 <h3>download</h3>
 
 <a href="download/vis.zip">Click here to download vis.js</a>
-(version <span class="version">0.6.0</span>)
+(version <span class="version">0.6.1</span>)
 
 
 <h2 id="example">Example</h2>