- Added pointer properties to the click and the doubleClick events containing the XY coordinates in DOM and canvas space.

HISTORY.md

@@ -8,6 +8,9 @@ http://visjs.org
 - Added points style for scatterplots and pointclouds.
 - Modularized the Graph2D draw styles.
 
+### Network
+
+- Added pointer properties to the click and the doubleClick events containing the XY coordinates in DOM and canvas space.
 
 ## 2014-11-07, version 3.6.4
 

docs/network.html

@@ -2382,6 +2382,8 @@ network.off('select', onSelect);
       <ul>
         <li><code>nodes</code>: an array with the ids of the selected nodes</li>
         <li><code>edges</code>: an array with the ids of the selected edges</li>
+        <li><code>pointer.DOM</code>:object containing XY coordinates in the DOM</li>
+        <li><code>pointer.canvas</code>:object containing XY coordinates in the canvas</li>
       </ul>
     </td>
   </tr>
@@ -2392,6 +2394,8 @@ network.off('select', onSelect);
       <ul>
         <li><code>nodes</code>: an array with the ids of the selected nodes</li>
         <li><code>edges</code>: an array with the ids of the selected edges</li>
+        <li><code>pointer.DOM</code>:object containing XY coordinates in the DOM</li>
+        <li><code>pointer.canvas</code>:object containing XY coordinates in the canvas</li>
       </ul>
     </td>
   </tr>

examples/network/02_random_nodes.html

@@ -77,7 +77,9 @@
       };
       var options = {stabilization:false};
       network = new vis.Network(container, data, options);
-
+        network.on('click', function(params) {
+            console.log(params)
+        });
       // add event listeners
       network.on('select', function(params) {
         document.getElementById('selection').innerHTML = 'Selection: ' + params.nodes;

lib/network/mixins/SelectionMixin.js

@@ -506,7 +506,12 @@ exports._handleTap = function(pointer) {
       this._unselectAll();
     }
   }
-  this.emit("click", this.getSelection());
+  var properties = this.getSelection();
+  properties['pointer'] = {
+    DOM: {x: pointer.x, y: pointer.y},
+    canvas: {x: this._XconvertDOMtoCanvas(pointer.x), y: this._YconvertDOMtoCanvas(pointer.y)}
+  }
+  this.emit("click", properties);
   this._redraw();
 };
 
@@ -525,7 +530,12 @@ exports._handleDoubleTap = function(pointer) {
                         "y" : this._YconvertDOMtoCanvas(pointer.y)};
     this.openCluster(node);
   }
-  this.emit("doubleClick", this.getSelection());
+  var properties = this.getSelection();
+  properties['pointer'] = {
+    DOM: {x: pointer.x, y: pointer.y},
+    canvas: {x: this._XconvertDOMtoCanvas(pointer.x), y: this._YconvertDOMtoCanvas(pointer.y)}
+  }
+  this.emit("doubleClick", properties);
 };