This class can be used to provide a drag'n'drop interaction.
const controls = new DragControls( objects, camera, renderer.domElement );
// add event listener to highlight dragged objects
controls.addEventListener( 'dragstart', function ( event ) {
event.object.material.emissive.set( 0xaaaaaa );
} );
controls.addEventListener( 'dragend', function ( event ) {
event.object.material.emissive.set( 0x000000 );
} );
[example:misc_controls_drag misc / controls / drag ]
[page:Array objects]: An array of draggable 3D objects.
[page:Camera camera]: The camera of the rendered scene.
[page:HTMLDOMElement domElement]: The HTML element used for event listeners.
Creates a new instance of [name].
Fires when the user starts to drag a 3D object.
Fires when the user drags a 3D object.
Fires when the user has finished dragging a 3D object.
Fires when the pointer is moved onto a 3D object, or onto one of its children.
Fires when the pointer is moved out of a 3D object.
Whether or not the controls are enabled.
This option only works if the [page:DragControls.objects] array contains a single draggable group object. If set to `true`, [name] does not transform individual objects but the entire group. Default is `false`.
See the base [page:EventDispatcher] class for common methods.
Adds the event listeners of the controls.
Removes the event listeners of the controls.
Should be called if the controls is no longer required.
Returns the array of draggable objects.
Returns the internal [page:Raycaster] instance that is used for intersection tests.
[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/controls/DragControls.js examples/jsm/controls/DragControls.js]