CODEWITHSUNDEEP
jqueryraphael
karthik
karthik

Reputation: 765

Event handling in Raphael Javascript library

I am working with Raphael JS library. It's been so great and suits the requirements too. I am trying to figure out, how to write a generic event handler for all the nodes in library. I would need the 'clicked' object instance to customize it's attributed on click event.

I have declared an ID for the 'raphael canvas' in CSS, so for any click on the canvas I would receive the event in this handler using jQuery. I have also attached 'node.id' for all the nodes in the canvas.

Here is the prototype of gen. event handler.

$j('#holder').bind('click', function(event) {

  // event handler.

}

However, I am unable to receive the 'object instance' of the node that was clicked.

event.srcElement attribute has also failed.

Any help would be greatly appreciated.

Thanks, Karthik.

Upvotes: 0

Views: 629

Answers (2)

user56reinstatemonica8
user56reinstatemonica8

Reputation: 34074

I think the problem may be that you are using jQuery's click function to bind the event to the DOM/SVG/VML that Raphael has output, when it sounds like what you want to get is the original Raphael data object that controls this output (rather than the actual output itself).

So you probably will get what you want by calling Raphael's own .click() function binding on to the variable you defined when you first called the Raphael function (e.g. the someVar in var someVar = Raphael(xxx...);).

Then, within the function, this should give the Raphael object (although calling the variable you already defined from within the .click(function(){ }); may give more reliable results, especially if later on you want to bind an event to a set). event.target will most likely still give the DOM element that was actually clicked on.

That's how it works for elements, the same or similar logic would probably follow for the paper/canvas itself.

Upvotes: 2

jjmontes
jjmontes

Reputation: 26875

Shouldn't it be event.target ?

(according to http://api.jquery.com/category/events/event-object/).

Upvotes: 0

Related Questions