Set dynamically generated group's pivot position to the center of its children objects position

Questions
1

Hi @mrdoob, @prisoner849, @ProcStack
I am trying to select multiple objects(groups) and trying to move all the selected objects simultaneously with shift click.

I have done some code and able to achieve “the selection and movement of objects” functionality by creating a group dynamically with selected objects as it’s children and then attaching the transformation control.

Also when user released the shift key I am removing the dynamically generated group and detach all the objects from that group along with transformation control.

Now I am stuck at one point, when I am creating a group it’s position and pivot position will set to default 0,0,0 irrespective of the selected object positions.

Now I want to set the generated group position to the center of the selected objects (group children) and when the user released the shift key, all children object will be detach and will have the same position as with in the group.

I have also attached the screen shot and code snippet below.

Please suggest the solution…

Below is code snippet:

function onMouseDownCustom(event) {
        // Shift Key 
        if (editor.selected != null && !editor.selected.name.includes('Light')) {
            if (selection.filter(Data => Data.uuid == editor.selected.uuid).length == 0) {
                selection.push(editor.selected);
            }
        }
        if (event.shiftKey) {
            if (selection.length > 1) {
                for (var i = 0; i < selection.length; i++) {
                    group.add(selection[i]);
                }
                scene.add(group);
                transformControls.attach(group);
            }
        }
        else if (!event.shiftKey) {
            if (selection.length > 1) {
                for (var i = 0; i < selection.length; i++) {
                    var obj = selection[i];
                    THREE.SceneUtils.detach(obj, group, scene);
                }
                transformControls.detach(group);
                scene.remove(group);
                group = new THREE.Group();
            }
            selection = [];
        }
        //End Shift Key 
        var array = getMousePosition(container.dom, event.clientX, event.clientY);
        onDownPosition.fromArray(array);
        handleClick(event);
        document.addEventListener('mouseup', onMouseUp, false);
    }

image