Event handling

As mentioned, JointJS library is based on the Backbone MVC library. So let's try some Backbone stuff now. For instance, let's see all the events triggered by any model in the graph:

graph.on('all', function(eventName, cell) {
    console.log(arguments);
});
To see the triggered events, open the browser console and make some changes to the paper above: Move the rectangles around, create a new vertex by dragging the link, remove a vertex, disconnect the link by dragging the highlighted arrowhead, remove the link, ...

You can also react on a specific event on a particular model:

rect.on('change:position', function(element) {
    console.log(element.id, ':', element.get('position'));
});
Please see the API reference for a list of events that you can react on for models (joint.dia.Element, joint.dia.Link and joint.dia.Graph) and views (joint.dia.Paper).