Mouse events often need to be combined to create more complex interactions such as drag, pan, and zoom. Normally, this requires a good quantity of code to track sequences of the mouseenter
, mousemove
, and mouseexit
events.
D3.js provides us with a better way of implementing these interactions through the use of behaviors. These behaviors are a complex set of DOM/SVG interactions through D3.js itself handling the mouse events. In a sense, behaviors function similarly to gesture recognizers on mobile platforms.
D3.js currently provides two built-in behaviors:
Let's examine an example of implementing drag and another that also adds pan and zoom capabilities.