O'Reilly logo

Learning Raphaël JS Vector Graphics by Damian Dawber

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

The drag-and-drop functionality

The drag-and-drop functionality is a powerful feature of Raphaël. In particular, we are offered a good deal of control over drag events, which affords us the ability to create more usable applications.

The Element.drag() method

The drag method of an element has the following syntax:

Element.drag(
    onmove, onstart, onend, [mcontext], [scontext], [econtext]
)

The onmove, onstart, and onend functions are callback functions invoked during the life cycle of a dragged element, while mcontext, scontext, and econtext define the this variable in the scope of these functions (defaulting to the element that is being dragged).

The onstart event handler

The onstart event handler is called when element dragging is first initiated. It ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required