Learn D3.js

Mouse events in D3

The global d3.event object is a generic event wrapper that contains the current event during the execution of a listener. You can use it to access standard Event fields, such as the defaultPrevented, type, or target; fields of the specific interface type (for example, clientX if MouseEvent); and methods, such as preventDefault() and stopPropagation().

In a listener that captures MouseEvents, for example, you can capture the mouse pointer's coordinates, (relative to the browser's viewport) using the d3.event object, as shown in the following code (see Events/10-d3-event.html):

const point = [d3.event.x, d3.event.y];

The browser's viewport is usually not the same as the SVG viewport (unless you position the SVG element absolutely ...