search

AR-js-org / AR.js

Image tracking, Location Based AR, Marker tracking. All on the Web.
MIT License
5.48k stars 935 forks source link

iOS White screen when having places on camera view (location based) #414

Open antoniskamzel opened 2 years ago

antoniskamzel commented 2 years ago

Do you want to request a feature or report a bug?

Bug

What is the current behavior?

When I open the AR screen, the code loads, the places are loaded, all permissions are given but when i look somewhere where a place is shown in the camera, it stops the camera and gives me a white screen (while the places still appear at the direction that they should) and when i turn the phone-camera at a direction where no places are shown, it returns back to normal (the camera shows again, whote screen is gone). It worked normally until a couple of days ago, with no issue and with no changes to my code.

If the current behavior is a bug, please provide the steps to reproduce.

Just load the code that i provide and you will see.

My app runs natively as well. An interesting thing is that on safari (web) it has the problem that I just describes but on the native app it works normally, as it should.

iPhone 11, latest iOS version ar.txt

nickw1 commented 2 years ago

Unfortunately I do not have an iOS device to test, but is it just iOS only? Does Android have the same problem?

Have you tried looking at the console to see if any errors are reported?

What do you mean when you say the "native app"?

antoniskamzel commented 2 years ago

@nickw1 It's a PWA web app (Ionic, Vue) and I converted it to a native through PWA Builder. And when i run the native app, the AR works fine, but on safari i have the the problem that i described No i haven't checked the console for any errors, but i probably will soon. And yes, the problem appears only on iOS

nickw1 commented 2 years ago

@antoniskamzel ah ok thanks. Would be great if you could report what the log is saying as it does appear to be a browser-specific problem.

nxv109 commented 2 years ago

I also have a similar problem. The test device information is: Device: Iphone IOS 15.4.1 Browser: Safari

I also tried on Pixel 3axl (Android 12 - Chrome) but not having this issue.

nickw1 commented 2 years ago

Do you still get this with the new location-based components? Check out the dev branch and try the new-location-based components (to see how to use, there is an example in the new-location-based directory in examples).

antoniskamzel commented 2 years ago

Did anyone find-fix anything for this?

nickw1 commented 2 years ago

@antoniskamzel are you using the new location-based components from 3.4.0? For A-Frame these are available under new-location-based; there is also an example in the examples/new-location-based directory. Does the example work? Do you have any output on the console?

Platform-Group commented 1 year ago

This still happens for me, in general AR.js just seems to be incredibly buggy. I'll often have a white page, sometimes entities won't appear, true north is never in the correct direction. I have a poco F5 which is very new, but I can only assume that this must be somewhat specific to my device as the sheer number of issues I'm running into can't be normal

nickw1 commented 1 year ago

@Platform-Group could you try the examples included in the repo? Clone the repo and run a server in its root directory, and try out the examples on your device using port forwarding with Chrome developer tools.

Try both the A-Frame new-location-based and classic location-based examples. Do any work for you?

Unfortunately these kinds of bugs are rather difficult to diagnose as they seem to occur only on certain devices; all the examples work as expected on my own device (Pixel 3 currently running Lineage OS 19, formerly running stock Android 12, and before that 11 and 10).

They could be related to differences in the implementation of the underlying Device Orientation API on different browser versions or differing sensors but it's hard to know to be sure.

Are you able to do a little debugging yourself with the Chrome developer tools to see if a console error is printed when the white screen comes up? Does the position of the boxes depend on which direction the device is facing when the application starts up? (this has been reported before, but again, not on all devices).

Sorry I can't offer any more direct help but hope you can appreciate that it's tricky to debug these issues when they seem to be device-specific. What we'd really welcome for AR.js is more developers with a wider range of devices, particularly iOS devices.

@nicolocarpignoli not sure if you look at AR.js these days but one thing I am wondering about is the _calculateCompassHeading() method in the older location-based components, e.g.

https://github.com/AR-js-org/AR.js/blob/master/aframe/src/location-based/gps-camera.js

which seems to replicate the functionality provided by the device orientation API as used in A-Frame. Are you able to explain the rationale for this code and whether it solves device orientation issues? Thanks.

Platform-Group commented 1 year ago

@nickw1 when my camera fails and I get either a white or black screen, I get nothing from the chrome developer tools. I can work around this by just restarting the browser though, so it's not a huge deal. My main problem at the moment is how inaccurate the compass/magnetometer is, my location's never show up in the correct position in AR as it always has north pointing in the wrong direction. I was just looking into how I could do some kind of manual calibration with a marker image to tell ar.js which way north is, but I'm not sure on that implementation yet.