Sign in to follow this  
gronk

Pixi.js sprites offset when dragging

Recommended Posts

View the jsfiddle demonstrating the issue (just click and drag the circle - relevant code on line 102).

When I add a circle to the stage with Pixi.Graphics and drawCircle( 150, 100, 50 ), the circle when dragged becomes offset by it's position ( +150, +100 ) in the Graphics container.

(and if we request the circle.position it's also inaccurate)

What's the best way to add a shape to the screen and set it's position if it's not through a Graphics container?

Share this post


Link to post
Share on other sites

1.  Its common newbie mistake. Position of graphics is independent from shapes. What do you think will happen with position if you draw two circles?

graphics.position.set(150, 100)
graphics.drawCircle(0, 0, 50)

2. There was a thread about dragging two weeks or so ago, i posted working code there. Im on mobile device, so, please find it on your own

Share this post


Link to post
Share on other sites

I think this is the post you're referencing, which is very helpful thank you.

I'm testing out your code but I'm still experiencing the shape being offset while dragging, check out this new fiddle demonstrating where I'm at. (click and drag the circle multiple times, it's origin is always where it was originally set)

I still don't understand how Pixi expects me to add shapes to the screen with drag controls, because it seems that I'm doing it wrong and it's screwing up the dragging.

Share this post


Link to post
Share on other sites

Ok, first, clone() doesnt work in v4, right, but that doesnt mean you just can use an assignment there. we NEED that oldPosition, there's no way you calculate drag without it. And without clone() it wil be always the same as current position

//in dragstart
this.oldPosition = new PIXI.Point();
this.oldPosition.copy(this.position);
//in dragmove
pv.x = pv2.x + (newPosition.x - this.dragPos.x);
pv.y = pv2.y + (newPosition.y - this.dragPos.y);

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.