I'm trying to implement stepped positioning on canvas elements in KonvaJS. Here is the minimal, reproducible example I've created to see the problem better: https://codesandbox.io/s/autumn-wave-wkz4ut?file=/src/App.tsx
Everything is fine if the Stage is at position (0, 0)
. But once the Stage position is set to some arbitrary value (either set directly or by dragging the Stage), and the green Rect is dragged, there's a small movement that happens when letting go of the green Rect. This doesn't happen if the setX()
and setY()
functions aren't called in the onDragEnd
prop of the Rect. In my project use case, this is necessary, so removing those calls is not an option.
It seems like the position given to the dragBoundFunc
prop is not the same as the position given in the onDragEnd
prop (through event.target.position()
). Is this a bug? If it isn't, is there a way to retrieve the same position given to the dragBoundFunc
? Thank you!
Edit: Thank you @lavrton for the answer! Seems I'm going about this the wrong way, I'll post the proper answer once I make it work on my side.