I know how to pin objects to objects using raycaster, but,How can I comeback to those same pinned objects and move them again? It’s for a Virtual Gallery I’m making where a user can upload images as paintings and position them on walls. To be clear how can I constrain the paintings on the wall to the pointer when clicked on. Here is a simplified version of what I have so far that’s editable charming-dew-tmvmvy - CodeSandbox. And the actual scene https://main--serene-beijinho-9a5d3a.netlify.app/. If you could point me in the right direction, greatly appreciate it. If any of the scenes seems wonky just refresh.
get the normal or forward vector of your wall or plane and raycast.ray ( plane ) and get its point
You need to fiddle with offsets and mem positions but the basic idea is this
You need to solve for where an infinite plane is positioned and then get the ray of the mouse onto it
IF its just in 2d you can just get the offset of the mouse and convert that to 3d space
You can also have a limited plane by just using a 3d plane object and positioning it where you need and visibility false it. You can also just compute the mouse offset and convert that to 3d as a scalar and slide the objects two axis around with those deltas
Math infinite plane
https://threejs.org/docs/?q=plane#api/en/math/Plane
Ray plane
https://threejs.org/docs/?q=rayca#api/en/math/Ray.intersectPlane
Mind you these are infinite. Youll need to constrain. Or just size up a 3d plane as offered above