Kinetic JS - How to get the coordinates of member of a group (after group has been dragged)?

kineticjs
Arturo E picture Arturo E · Aug 8, 2012 · Viewed 8k times · Source

I have a group of Kinetic.Rectangle objects with draggable set to true. No matter how much you drag the group around, calling rect.getX() or rect.attrs.x, where rect is one of the rectangle objects in the group, e.g.: 

var rect = group.get('.rect')[0];

always returns the same value. Anybody know how the get the actual x and y values of where each rectangle is being drawn?

Thanks!

Answer

Erfan Zarger picture Erfan Zarger · Aug 8, 2012

I guess the reason that you get the same results is because you get the relative position of each rec. I usually use the following codes to get the position of my objects:

Shape.getAbsolutePosition().x

or

shape.getPosition().x

hope this would be helpful.

Related questions

Scroll the page on drag with jQuery

I have tried using kinetic.js and the code below, however when I try this in IE11 it keeps jumping to the top every time I scroll: $("html").kinetic(); I want to make the page scrollable on tablets and IE10 …

Read More
Fast and responsive interactive charts/graphs: SVG, Canvas, other?

I am trying to choose the right technology to use for updating a project that basically renders thousands of points in a zoomable, pannable graph. The current implementation, using Protovis, is underperformant. Check it out here: http://www.planethunters.org/…

Read More
How can i stop all audio playing using Jquery

I'm updating a div in a page using jquery mobile in order to play some animations. The animations also play sound through use of document.createElement('audio'); My problem is, when I update the page to another animation, the old …

Read More