Question

So, basically I have a piechart drawn with Raphael. Each segment corresponds to a different value and I want to have a unique tooltip popup for each segment. In this example I am trying to draw a circle every time one of the segments are hovered, but I can’t figure out a way to do it dynamically so that I can set the position point relative to the segment that is being hovered. Sorry for poor and convoluted explanation, but you can see the example of my code here:

http://jsfiddle.net/DgrgC/2/

Thanks for your help!

Answer 1

Inside the hover callback, this refers to the current path you’re drawing. So this.attrs contains the path attributes. Note that paths don’t have cx and cy attributes, as you’re trying to access in you example.

I’m not sure what you’re trying to accomplish, but you can check my example on how to draw some circles based on path data:
http://jsfiddle.net/DgrgC/3/

Basically:

this.attrs.path[1] //second point of the path
this.attrs.path[1][1] //x coordinate of this point
this.attrs.path[1][2] //y coordinate of this point