Rendering Three.js examples on Sony Xperia Z4 Android Tablet in Chrome

Hey Three.js team,
I found this weird bug that I thought you might find interesting.

When I attempt the cloth animation three.js example (https://threejs.org/examples/#webgl_animation_cloth) on this tablet in Chrome, it only shows a small part of the rendered canvas.

screenshot_20170519-150642
(What it looks like on device)

image
(What it looks like normally)

I debugged this a little bit. When setSize is usually called, it edits a _canvas variable, which usually adjusts the screen immediately after being set. However, in Chrome on this device this does not happen. To make a weird case even weirder, this example actually works on mobile Firefox on the same device.

Is this something that can be fixed from inside three.js, or is this something to developers of WebGL have to address?

Thanks so much!

Three.js version
  • Dev
  • r85
Browser
  • All of them
  • Chrome
  • Firefox
  • Internet Explorer
OS
  • All of them
  • Windows
  • macOS
  • Linux
  • Android 7
  • iOS

Hardware requirements for the device are right here: https://www.cnet.com/products/sony-xperia-z4-tablet-sgp771-tablet-android-6-0-marshmallow-32-gb-10-1-3g-4g/specs/ (however, I tested this on Android 7, not 6)

Author: Fantashit

2 thoughts on “Rendering Three.js examples on Sony Xperia Z4 Android Tablet in Chrome

Comments are closed.