CODEWITHSUNDEEP
javascriptjquerycssraphael
Abdelali AHBIB
Abdelali AHBIB

Reputation: 602

get dynamically the x & y values of a raphaeljs element even if it moves

how to get dynamically the x & y values of a raphael js element even after a zoom or a left or right move, I want to show a div near to my element, when I show the element.getBBox() values I found that they don't change even if I move the element or I zoom in/out, my code that I use to get x & y values seems like this :

x = (myElement.getBBox().x+myElement.getBBox().x2)/2;
x+=$("#container").offset().left;
y = (myElement.getBBox().y+myElement.getBBox().y2)/2;
y+=$("#container").offset().left;

and the code that moves my div (a tooltip) is :

$("#myTooltip").css({"left":x+"px","top":y+"px"}).show();

Note : it works when I do the same thing with mouse coordinates (using x=e.pageX;y=e.pageY;) but in this case I want to do it when I click on another button in the page

thank's in advance

Upvotes: 3

Views: 992

Answers (2)

Abdelali AHBIB
Abdelali AHBIB

Reputation: 602

The solution is to use myElement.attr('x') and myElement.attr('y') instead of myElement.getBBox().x and myElement.getBBox().y, thank you A.S. Roma, don't forget to say hello to Totti

Edit : if someone have the same problem, the best solution I found untill now is to use jquery and raphael, explication : First of all I need in the definition of the element to add an ID like this : myElement.node.id='myUniqueId' and after that you can access to the element using jquery like this x = $("#myUniqueId").offset().left and y = $("#myUniqueId").offset().top

Upvotes: 1

Brian
Brian

Reputation: 5028

I am also using Raphael and came across to what I think you need in your project.
In order to understand how x and y can be shown dynamically, look at this DEMO:

While you are dragging objects around, you can see their coordinates change dynamically. Good Luck

Upvotes: 1

Related Questions