model-viewer: Model shifts vertical position after exiting scene viewer

Description

On my pixel 2 Chrome browser, after exiting scene viewer and returned to the website, the model would shift downward from center position.

Screen Shot 2019-05-13 at 6 08 56 PM

Live Demo

https://googlewebcomponents.github.io/model-viewer/examples/augmented-reality.html https://glitch.com/~storm-list

Browser Affected

  • Chrome
  • Edge
  • Firefox
  • Helios
  • IE
  • Safari

OS

  • Android
  • iOS
  • Linux
  • MacOS
  • Windows

Versions

  • model-viewer: vX.X.X
  • three.js: rXX

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Comments: 23 (10 by maintainers)

Most upvoted comments

It’s glitchy when resizing horizontally though. https://model-viewer-tests.glitch.me/resize-horizontal.html

Team work 💯

For me, the problem is linked to the drawing coordinates of WebGL vs Canvas.

Thanks @DavidPeicho . Now that I have had a chance to read the PR it makes a lot of sense.

It’s probably this one. I’ll test @DavidPeicho’s suggestion.

Yes, the problem is related to: Make .setViewport(), .setScissor() relative to lower-left corner. #13593 (@WestLangley)

@DavidPeicho Thanks! Yes, makes sense that the viewport change affected this. I’ll take a look.

The fix is actually simple, if you go to this line.

You have to had something like:

context.drawImage(
          this.renderer.domElement,
          0,
          this.height - height,
          widthDPR,
          heightDPR,
          0,
          0,
          widthDPR,
          heightDPR);

The problem comes from the fact that the renderer main framebuffer is not resized to the current viewer size for optimization purpose.

EDIT: If I have time later I can make the PR, but I have to be sure it doesn’t break anything else.