Drag 3D object with mouse using three.js

I have created a 3d rectangular pyramid. Now I need to drag it around the canvas using mouse( not self-rotation or moving at place with mouse click). Any contribution related to this is highly appreciated.

1 Like

Have you considered to use DragControls for this? There is also an example that demonstrates its usage:

https://threejs.org/examples/#misc_controls_drag

1 Like

Thankyou for sharing the example. Will update once when I achieve my goal :slight_smile: and Thanks Mugen …I observed that you reply to almost every questions. You are doing a great job by making others job easier :slight_smile:

4 Likes

You can look there too. Collection of examples from discourse.threejs.org

see https://hofk.de/main/discourse.threejs/2019/index2019.html
RestrictDragControls
TransformControls
DraggingObjects
Carousel
MoveObject
Links in Source code.

1 Like

I tried with the example. What I did was, I copied all the required files to the html folder and tried running it. But it gives an error as “Access to script at ‘file:///C:/Users/CF-54/Desktop/3D%20FOV/three.module.js’” from origin ‘null’ has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.