Camera rotation issue in 3D scene

okay the issue was fixed by keeping the value of z closer to 0.

I am seeking for the help in scene rotation with mouse drag, as it stucks sometimes for only when we try to rotate right to left side.

function animate() {
  requestAnimationFrame(animate);
  controls.update(); // Update controls

  if (isRotating) {
    const angle = Date.now() * cameraRotationSpeed;
    const radius = Math.sqrt(
      Math.pow(camera.position.x, 2) + Math.pow(camera.position.z, 2)
    );

    camera.position.x = radius * Math.sin(angle);
    camera.position.z = radius * Math.cos(angle);
    camera.lookAt(new THREE.Vector3(0, 0, 0));
  }

  renderer.render(scene, camera);
}

drag handling

//click event capture for updating texture on walls and floor
let isDragging = false;
let mouseDownPosition = new THREE.Vector2();

renderer.domElement.addEventListener("mousedown", (event) => {
  mouseDownPosition.set(event.clientX, event.clientY);
  isDragging = false;
});

renderer.domElement.addEventListener("mousemove", () => {
  isDragging = true;
});

renderer.domElement.addEventListener("mouseup", (event) => {
  const mouseUpPosition = new THREE.Vector2(event.clientX, event.clientY);
  const distance = mouseUpPosition.distanceTo(mouseDownPosition);
  if (distance < 3) {
    // Considered a click
    onMouseClick(event);
  } else {
    togglePlayPause(false);
    // Considered a drag
  }
});

please someone guide.

Thanks in advance :slight_smile: