search

google / model-viewer

Easily display interactive 3D models on the web and in AR!
https://modelviewer.dev
Apache License 2.0
6.69k stars 798 forks source link

Augmented Reality does not work on iOS #4658

Open AmitMY opened 5 months ago

AmitMY commented 5 months ago

(related to #3548)

Description

in Safari in iOS, I can see the "mixed reality" button, while wrapped in a native app, using capacitor, it does not show. Anyway, even in safari, clicking it does not do anything, and there is nothing in the console.

Safari WKWebView
IMG_AE61C6490159-1 IMG_EE03C8B53D10-1 
<model-viewer
  #modelViewer
  alt="3D Sign Language Avatar"
  camera-controls
  camera-orbit="0deg 90deg auto"
  camera-target="0m 2.8m 0m"
  field-of-view="90deg"
  interaction-prompt="none"
  loading="eager"
  preload
  ar
  ar-scale="fixed"
  xr-environment
  src="3d/character.glb"
  ios-src="3d/character.usdz"
  ar-modes="scene-viewer webxr quick-look"></model-viewer>

Live Demo

Reproduction available in https://sign.mt

  1. write "test"
  2. hit the view switcher on the bottom right image
  3. and change to the avatar image

Version

Browser Affected

OS

AR

elalish commented 5 months ago

In your site I don't see the ios-src that you have in your comment. How much filesize does your GLB have? When you click the AR button, does it disappear and then reappear? Sometimes Safari is strangely slow to process USDZs.

AmitMY commented 5 months ago

It only adds the ios-src when you open the site from iOS (emulator or real device), because of the way my caching system works for offline usage.

image

In order to debug, I open the site on my iPhone, and then using safari developer tools view the iPhone dev tools.

Clicking the AR button does not flicker, doesn't do anything.

The GLB is 27mb: https://firebasestorage.googleapis.com/v0/b/sign-mt-assets/o/3d%2Fcharacter.glb?alt=media The USDZ is 19mb (converted using reality converter): https://firebasestorage.googleapis.com/v0/b/sign-mt-assets/o/3d%2Fcharacter.usdz?alt=media

elalish commented 5 months ago

27mb is huge - you really shouldn't need more than 5 if you've properly optimized for mobile. You may be running out of GPU RAM. Can you make a simple repro with a smaller model and no fancy caching? I would guess the problem is caused by one of those two.