koobas.hobune.stream
WebGL lock orientation on mobile browsers
Hi everyone.
I am trying to lock browser orientation for webgl game to run it on landscape mode. In order to lock the orientation on mobile browsers (Chrome, Opera) I need to enter in fullscreen mode.
In index.html file I have made a button for entering the fullscreen mode, and then changing orientation to landscape.
Here's how it is done.
<script type="text/javascript">
var changeScreenOrientation = function()
{
var elem = document.getElementById('gameContainer');
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.msRequestFullscreen) {
elem.msRequestFullscreen();
} else if (elem.mozRequestFullScreen) {
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) {
elem.webkitRequestFullscreen();
}
screen.orientation.lock('landscape');
}
</script>
<input type="button" onclick="changeScreenOrientation()" value="Change Screen Orientation" size="100" />
The problem is when I enter in fullscreen mode and lock the orientation, here's what happens. 
As you can see, the game content size is changed and doesn't fit in the screen.
And here's how it should look like. 
Any ideas how to fix this issue?
Did you find a solution to this? I'm having a similar problem with my mobile WebGL.
@Jarvv I tried to swap screen resoulution from Unity side. It only worked for the first time I entered full screen mode. But for the next time this trick didn't work. I haven't debugged it precisely as the requirements were changed for the project.
