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