I am currently working on visualizing objects in a web browser. The goal is to display these objects rotating around one axis at a time (either X, Y, or Z) or allow the user to interactively rotate them using their mouse. However, I have encountered several issues that need to be addressed:
1- When I enable auto-rotation of the object along a single axis, it initially rotates smoothly but after some time, the rotation becomes discrete with abrupt changes (approximating 180-degree increments).
2- Rotating the object using the mouse results in a non-smooth experience, likely due to the frequency of mouse events being fired.
3- Is there a way to implement dual-axis rotation for the object using the mouse? Specifically, around both the Y and X axes simultaneously.
4- I have attempted to confine the view window within a small div, however, the rendered output exceeds the boundaries of the specified container.
Below is the code snippet I am currently using:
<script>
// Code snippet goes here...
</script>
I appreciate any insights or assistance regarding the mentioned issues. Thank you!