I'm currently running tests on a web application built using three.js, and it seems that users on tablets, especially Android devices, are experiencing some unusual behavior within the scene.
https://i.sstatic.net/FkFi3.jpg
Below is how the view should normally appear:
https://i.sstatic.net/wWkTw.jpg
The issue occurs when users change the orientation of their device, but it has also been reported by a user utilizing a 2-in-1 tablet with Windows operating system in Microsoft Edge. When swiping across the screen, the browser tries to scroll both vertically and horizontally but then suddenly jumps back to the fixed view. So far, this problem has not been observed on desktops.
Here is the function I have implemented for handling window resizing:
function onWindowResize(event) {
SCREEN_WIDTH = window.innerWidth;
SCREEN_HEIGHT = window.innerHeight;
renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
camera.aspect = SCREEN_WIDTH / SCREEN_HEIGHT;
camera.updateProjectionMatrix();
composer.reset();
}
Any insights or suggestions would be greatly appreciated!