Drop target detection using physics engine (Matter.js, Drag & Drop)

This idea will undergo another rewrite soon. Meanwhile also check a similar idea without using a dynamic Physics object I recently posted here (only needs static objects):

And also make sure to check out the great drag'n'drop enabler by Hans. It uses modern approaches and the intersection observer API. As the latter is still not supported in Safari you do need a polyfill but it's the faster technology and is the future specially when browser support is complete.

That said, the challenge of this thread is the focus on the Matter.js engine and to find a solution that works with odd shapes (made with the vector tool) using the built-in capabilities of Hype. Also, I'll hopefully be digging into some other collision detection features that go beyond simple overlapping.

3 Likes