How to check if an object is currently being hovered by the mouse whilst taking rotation into account?

Jamzy01 commented 1 year ago

I have tried the Two.Path.getBoundingClientRect api, which works flawlessly for rectangular unrotated objects, although for rotated objects as this only returns an unrotated rect it does not work perfectly. Is there an api that will be able to check if any point is within a Two.path (including convex and concave shapes) that also takes rotation into account, or how easy would this be to implement myself?

Environment (please select one):

[ ] Code executes in browser (e.g: using script tag to load library)
[x] Packaged software (e.g: ES6 imports, react, angular, vue.js)
[ ] Running headless (usually Node.js)

If applicable:

Desktop (please complete the following information):

OS: Windows
Browser: Edge Webview 2

jonobr1 commented 1 year ago

Thanks for reporting! This branch should fix those issues: https://github.com/jonobr1/two.js/tree/issue-697-bounding-box

I still need to do some additional performance testing before merging into the main branch however.

jonobr1 commented 1 year ago

This example uses the aforementioned branch: https://codepen.io/jonobr1/pen/YzJGNOq

Jamzy01 commented 1 year ago

Thanks, this should work perfectly.

jonobr1 / two.js

How to check if an object is currently being hovered by the mouse whilst taking rotation into account? #697