Why the cloned sphere is not rotated

Questions
1

I have load a sphere and cloned it two times. I want to rotate both sphere but only one are rotating: Plunker - Atom rotation Three.js and JavaScript

I have loaded, cloned, created two spheres here:

let sphereLeft;
let sphereRight;
let sphereRed;

async function loadAssets() {
    const loader = new ColladaLoader();
    const textureLoader = new THREE.TextureLoader();

    const spherePromise = await loader.loadAsync("./assets/sphere.dae");
    const sphere = spherePromise.scene.children[0];

    sphereLeft = sphere.clone();
    sphereLeft.scale.set(0.2, 0.2, 0.2);
    sphereLeft.position.set(-3, 0, 0);
    const sphereLeftTexture = await textureLoader.loadAsync("./assets/point-to-left.png");
    const sphereLeftMaterial = new THREE.MeshBasicMaterial({ map: sphereLeftTexture });
    sphereLeft.material = sphereLeftMaterial;
    scene.add(sphereLeft);

    sphereRight = sphere.clone();
    sphereRight.scale.set(0.2, 0.2, 0.2);
    sphereRight.position.set(3, 0, 0);
    const sphereRightTexture = await textureLoader.loadAsync("./assets/point-to-right.png");
    const sphereRightMaterial = new THREE.MeshBasicMaterial({ map: sphereRightTexture });
    sphereRight.material = sphereRightMaterial;
    scene.add(sphereRight);

    render();
}
loadAssets();

The first sphere is rotated but the second one is not:

function render() {
    if (sphereLeft && sphereRight) {
        sphereLeft.rotation.z -= 3 * clock.getDelta();
        sphereRight.rotation.z -= 3 * clock.getDelta();
    }
    orbitControls.update();
    renderer.render(scene, camera);
    requestAnimationFrame(render);
}
render();
2

Calling clock.getDelta() will reset the delta, so in the second call it will be 0.

        const delta = clock.getDelta();
        sphereLeft.rotation.z -= 3 * delta;
        sphereRight.rotation.z -= 3 * delta;
4 Likes