AR.js icon indicating copy to clipboard operation
AR.js copied to clipboard

Camera loading on full zoom

Open zhanghoo opened this issue 4 years ago • 8 comments

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

What is the current behavior? If I load the webpage on Android on Huawei P30Pro it zooms very far in meaning I cannot use the application correctly.

If the current behavior is a bug, please provide the steps to reproduce. Just loading the page on the phone does it it, you don't need to do anything special. The camera will load with a full zoom.

Please mention other relevant information such as the browser version, Operating System and Device Name on Android on Huawei P30Pro

What is the expected behavior? I would expect that it does not zoom and works properly like on every other phone/device but unfortunately on this phone with Android the camera is zooming in fully.

If this is a feature request, what is motivation or use case for changing the behavior?

Here are some screenshots Android_10_Huawei_P30_Pro_Weixin_App_Browser Android_10_Huawei_P30_Pro_Native_Camera Android_10_Huawei_P30_Pro_Native_Browser

IOS is OK IOS_14 3_IPhone_6_PLUS_Native_Camera IOS_14 3_IPhone_6_PLUS_Native_Browser

zhanghoo avatar Jan 24 '21 11:01 zhanghoo

i have this issue too on my devices (pixels)

terranauts avatar Feb 11 '21 04:02 terranauts

In my case (pixel 4a), changing settings of viewport solved the same problem. Adding "user-scalable=no," to content attribute like following code worked well. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no," />

nakataki17 avatar Feb 16 '21 09:02 nakataki17

In my case (pixel 4a), changing settings of viewport solved the same problem. Adding "user-scalable=no," to content attribute like following code worked well. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no," />

I added it too, but it didn't work.

zhanghoo avatar Feb 18 '21 12:02 zhanghoo

Have you guys gone through the previous thread on this issue in the old repo? You might find a fix in there.

In my case I had one phone that always started zoomed in no mater what I did. But interestingly it work when using the codepen examples. It turned out on this phone "Force Enable Zoom" was enabled in the Chrome accessibility settings. Obviously we could ask the user to deselect that option but that wouldn't be a great experience! I managed to fix it by embeding my HTML in an iframe. I haven't found any drawbacks of this approach yet but we will see!

On another note does anyone know if there has ever been an attempt to record what hardware/browser/ARjs Version combinations work? It would be a useful bit of info for the AR.js documentation page.

qu1ckdry avatar Mar 11 '21 12:03 qu1ckdry

Thanks @qu1ckdry,

this is what I use now as iframe "container": https://pastebin.com/EKRLwQEz

rainerlonau avatar Aug 02 '21 08:08 rainerlonau

https://github.com/jeromeetienne/AR.js/issues/369#issuecomment-508783762 In some mobile phones, he can get multiple devices. https://simpl.info/getusermedia/sources/ In Huawei p30pro, I get five devices. Camera 1 is front camera. Camera 2 to 5 is back. Camera 2 is wrong, but camera 3 to 5 is OK.

zhanghoo avatar Dec 19 '21 05:12 zhanghoo

In Huwai, five devices. Camera 1 is front Camera device list image

Camera 2 image

Camera 3 image

Camera4 image

Camera5 image

And the Native Camera image

zhanghoo avatar Dec 19 '21 06:12 zhanghoo

Added the video sourceWidth and sourceHeight in ar.js

For Huawei P30 Phone:

sourceWidth: 1280; sourceHeight: 960

https://github.com/jeromeetienne/AR.js/blob/024318c67121bd57045186b83b42f10c6560a34a/three.js/src/threex/threex-artoolkitsource.js#L188

turkyden avatar Nov 23 '22 17:11 turkyden