Zoom only when mouse is over the globe

[Zaniyar]

How can we achieve that the globe only zooms in/out when the mouse is over the globe itself, instead of that the mouse is just over the canvas?

[Zaniyar]

I solved it in a cheap way, I know otherwise you have to use raycasting (send a ray which goes through the camera and the mouse and then hitTest if the ray collides with the globe):

function onMouseWheel(event) {
        console.log("Mouse X Y :: ", event.x, event.y);

        if (event.x > 720 && event.x < 1180 && event.y > 120 && event.y < 330) {
            event.preventDefault();
            if (overRenderer) {
                zoom(event.wheelDeltaY * 0.3);
            }
        }
        return false;
    }