Saving updated position of buffer Geo after Drag

[sana_rahman]

Hey everyone,

I’m currently working on a project where I’m using buffer geometry to create a rectangle shape in Three.js. I’ve implemented drag controls to allow users to interactively drag the rectangle around the scene. However, I’m facing a challenge in saving the new coordinates of the rectangle after it has been dragged.

I need to save these new coordinates so that I can load the data again when the page is reloaded. This way, the rectangle should be loaded at the position where it was last dragged. Can anyone provide some guidance or suggest a solution for achieving this functionality?

Any help or insights would be greatly appreciated! Thanks in advance.

[PavelBoytchev]

I would keep the buffer geometry unchanged. Instead I’d store and restore the mesh position property – these are just 3 numbers per mesh.

[hofk]

see Updating Mesh position is not updating its own geometry - #16 by hofk

[sana_rahman]

ok so, no one told me explicitly but here’s how u can save the updated positions after drag and load the data afterwards at the new position.

1. save the mesh attributes position array at any point (start or end as u like)
2. after dragging get the position from the mesh.position and store it with in the mesh position array( we stored psoition array and position now)
3. on loading data, create the buffer from the position array to create the shape and apply the mesh.position.set(x,y,z) . Get this x y z from the position that u stored.
   Now u get the shape at the updated position.
   here the position array with act as the local cords and the position set’s the shape in world cord system
   here i looged the position while dragging.
   
   

here in the mesh u find that the psoition is updated

u store this new psoition and after creating the shape with its cords data u apply this position so it i placed where it was last dargged.