clientX/clientY off?

Community Help
1

In draggable(), I’m trying to get the mouse coordinates (in order to control frequency and amplitude). However, they seem off quite a bit:

  • entering top left, the initial values are [15, 157]; expected [0, 0];
  • exiting lower right, values are [1156, 797]; expected [1152, 648];

What am I missing?

2

event.clientX and event.clientY are coordinates with respect to the page, which in the context of Observable means the contents of the sandboxed iframe. If you want the coordinates with respect to your canvas, you’ll need to translate the coordinates. You can use d3.pointer(event) to do that.

4

Thanks Mike! Works like a charm.