CODEWITHSUNDEEP
javascriptthree.js
PanChan
PanChan

Reputation: 382

How to drag and drop Object3D elements with three.js?

I took this example for drag&drop objects, it works perfect. But now I want to group some elements to drag&drop them together. I replaced the Cubes from the example with some Spheres and grouped them together in an Object3D().

var data = [[0,10],[50,20],[100,7],[150,18],[200,15],[250,3],[300,10],[350,25]];
var group = new THREE.Object3D();
    for(var i = 0; i< data.length; i++){            
        var mesh = new THREE.Mesh( new THREE.SphereGeometry(data[i][1],20,20), sphereMaterial);
        mesh.position.y = data[i][0];
        mesh.updateMatrix();
        group.add(mesh);            
    }
objects.push(group);
scene.add(group);

But I can't select this group of objects in my scene :( What I'm doing wrong? Isn't it possible to select a group? Or how must it look like?

Upvotes: 2

Views: 4496

Answers (1)

Simon
Simon

Reputation: 56

It's hard to tell without the code, but i think you might be using .intersectObjects(objects), you should try using .intersectObjects(objects, true) instead.

Here is the documentation :

.intersectObjects( objects, recursive )

objects — The objects to check for intersection with the ray.

recursive — If set, it also checks all descendants of the objects. Otherwise it only checks intersecton with the objects. checks all intersection between the ray and the objects with or without the descendants.

three.js Raycaster

Upvotes: 2

Related Questions