Three.js groups interconnect

hi

is there a way to connect 2 group together.
var group1 = new THREE.Group ();
var group2 = new THREE.Group () ;
var group 3 = group1+ group2 ;

thanks

  1. Add a third group and add 2 previous groups to it:
var group1 = new Three.Group();
var group2 = new Three.Group();
var group3 = new Three.Group();
group3.add(group1, group2);
/*
  group3 ->
    group1 ->
      child1
      child2
    group2 ->
      child3
      child4
*/
  1. Add children from group2 to group1:
var group1 = new Three.Group();
var group2 = new Three.Group();
group1.add(...group2.children);

/*
  group1 ->
    child1
    child2
    child3
    child4
*/

Would that solve it?

look kind of messy but did the job, thanks

do you know if this kind of TOUCH CONTROLS can be created in three.js ?

Just in case - these were two separate options. You shouldn’t use both of them at once. :grin:

Three.js is just a 3d graphics library / framework - you would need to use JavaScript and Touch events API to create controls like the ones in the video (with pop-up touch circles, separate actions assigned to left and right side of the screen etc.)

This is the list of ready / example controls Three offers out of the box: three.js/examples/jsm/controls at master · mrdoob/three.js · GitHub