Add another model in scene and move together

There is a group in my scene, and it’s position and rotation is changing in requestAnimationFrame,like:
There is a button which user can click to add a cube on top face of group. The cube’s position and rotation are same as group.

Here is question, my code is

const cube=new THREE.Mesh(g,m)

the cube is added to scene,but it’s postion and rotation are fixed. How can the cube moves or rotates with group?

Here is question

Where :’) ? (Your code itself is alright, for what I can see.)

sorry, I didn’t make it clear. The cube was added in the group after user click a button, but the cube cannot move or rotate with the group. How can I make the cube move with group?

Can you share a codepen or jsfiddle replicating the issue? If the cube is really added to the group, it should inherit group transformation (without any additional steps necessary.)

getItemsData() {
        if ( - this.dataSetting.itemsLastTime < this.dataSetting.itemsDiffTime) {   
            return 0  
        this.dataSetting.itemsLastTime =

            url: this.dataSetting.itemsURL,
            method: 'post',
        }).then(res => {
            this.dataSetting.itemsData =       //get new data
            const addItems = []  //, will add in the scene
            const delItems = []  //, will delete from the scene
            for (let i = 0; i < newItems.length; i++) {
                if (lastItems.includes(newItems[i]) === false) {
            for (let i = 0; i < lastItems.length; i++) {
                if (newItems.includes(lastItems[i]) === false) {

            for (let i = 0; i < delItems.length; i++) {
                const name = 'Package-' + delItems[i]
                scene.remove(scene.getObjectByName(name))            //it works!

            for (let i = 0; i < addItems.length; i++) {

                const info = this.dataSetting.itemsData[addItems[i]]     //get the mesh size, color, etc
                const pkg = scene.getObjectByName('_pkg_back').clone()
                pkg.scale.set(10, 10, 10)
                pkg.visible = true
       = 'Package-' + addItems[i]

                    const agv = scene.getObjectByName(info.location)        //in renderScene(), the AGV is a group and moving
                    agv.add(pkg)   //<----------------------------------here is add in a group


        }).catch(err => {
            console.log( err)
    }        ,

it moves suddenly… Thank you for your time

1 Like