Rotate mesh on mouse scroll

Questions
, ,
1

Hello everyone!!!
I am new to the forum and to threeJS.

I have a problem with the rotation of a mesh related to mouse scroll: the mesh should rotate from the starting position to a maximum of 90° by scrolling up with the mouse, while scrolling down with the mouse the mesh should return to the starting position. Scrolling with the mouse increases or decreases the rotation by 0.05.

I am pasting the code so as to make the idea better.

function onMouseWheel(){
    const delta = Math.sign(event.deltaY);
    window.console.log(delta);
    window.console.log(mesh.rotation.z);
    //var maxrotation = -Math.PI / 2;
    var maxrotation = -0.9500000000000003;
    var maxrotation2 = -0.9000000000000006;
    if(delta >= 0){
        if(mesh.rotation.z >= maxrotation && mesh.rotation.z <= 0){
            mesh.rotation.z += -0.05;
        }
    }else{
        if(mesh.rotation.z <= 0 && mesh.rotation.z >= maxrotation){
            mesh.rotation.z += 0.05;
        }
    }
}

The reference site is demo.lumina.it and the mesh that needs to rotate is David’s head.

Can anyone help me with this?

Thank you very much

Andrea

2

And what is the problem? For me the head rotates one way, it doesn’t rotate the other way around most likely because the page scrolls down instead, you could try to add event.preventDefault(); to onMouseWheel function to disable scroll, but this should only apply when you are over the canvas.

3

Hi @tfoller sorry for delay in reply.
Thank you for your suggest, but I had to rewrite the code because the client’s requirements had changed.

Bye Andrea