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.

This post was flagged by the community and is temporarily hidden.

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.