Added focusOnNode function #139

HISTORY.md

@@ -12,6 +12,7 @@ http://visjs.org
 ### Graph
 
 - Fixed error with zero nodes with hierarchical layout.
+- Added focusOnNode function.
 
 
 ## 2014-05-28, version 1.0.2

dist/vis.js

@@ -17851,7 +17851,35 @@ Graph.prototype.storePosition = function() {
 };
 
 
+/**
+ * Center a node in view.
+ *
+ * @param {Number} nodeId
+ * @param {Number} [zoomLevel]
+ */
+Graph.prototype.focusOnNode = function (nodeId, zoomLevel) {
+  if (this.nodes.hasOwnProperty(nodeId)) {
+    if (zoomLevel === undefined) {
+      zoomLevel = this._getScale();
+    }
+    var nodePosition= {x: this.nodes[nodeId].x, y: this.nodes[nodeId].y};
+    var canvasCenter = this.DOMtoCanvas({x:0.5 * this.frame.canvas.width,y:0.5 * this.frame.canvas.height});
+
+    var translation = this._getTranslation();
+    var requiredScale = zoomLevel;
 
+    var distanceFromCenter = {x:canvasCenter.x - nodePosition.x,
+      y:canvasCenter.y - nodePosition.y};
+
+    this._setScale(requiredScale);
+    this._setTranslation(translation.x + requiredScale * distanceFromCenter.x,
+      translation.y + requiredScale * distanceFromCenter.y);
+    this.redraw();
+  }
+  else {
+    console.log("This nodeId cannot be found.")
+  }
+};
 
 
 

docs/graph.html

@@ -2008,6 +2008,13 @@ var options: {
       The selections are not ordered.
     </td>
   </tr>
+    <tr>
+        <td>focusOnNode(nodeId, [zoomLevel])</td>
+        <td>none</td>
+        <td>This function will move the view to center on the specified node. An optional zoomLevel can be passed where 1.0 is 100&#37;, between 0.0 and 1.0 is zooming out and > 1.0 is zooming in. Generally, close to 1.0 is sufficient.
+            If this argument is not passed the view will only move, not zoom.
+        </td>
+    </tr>
     <tr>
         <td>storePosition()</td>
         <td>none</td>

src/graph/Graph.js

@@ -2183,7 +2183,35 @@ Graph.prototype.storePosition = function() {
 };
 
 
+/**
+ * Center a node in view.
+ *
+ * @param {Number} nodeId
+ * @param {Number} [zoomLevel]
+ */
+Graph.prototype.focusOnNode = function (nodeId, zoomLevel) {
+  if (this.nodes.hasOwnProperty(nodeId)) {
+    if (zoomLevel === undefined) {
+      zoomLevel = this._getScale();
+    }
+    var nodePosition= {x: this.nodes[nodeId].x, y: this.nodes[nodeId].y};
+    var canvasCenter = this.DOMtoCanvas({x:0.5 * this.frame.canvas.width,y:0.5 * this.frame.canvas.height});
+
+    var translation = this._getTranslation();
+    var requiredScale = zoomLevel;
 
+    var distanceFromCenter = {x:canvasCenter.x - nodePosition.x,
+      y:canvasCenter.y - nodePosition.y};
+
+    this._setScale(requiredScale);
+    this._setTranslation(translation.x + requiredScale * distanceFromCenter.x,
+      translation.y + requiredScale * distanceFromCenter.y);
+    this.redraw();
+  }
+  else {
+    console.log("This nodeId cannot be found.")
+  }
+};