Open nickw1 opened 3 years ago
https://github.com/AR-js-org/AR.js/issues/275#issuecomment-852179498
Hi Just want to let you know there might be some problem that this function not working well in China( not sure). I try this on three devices. The dialogue box pops out successfully every time when I refresh the site and got the right GPS reading. But all the box sizes are not changed corrsponding when I walking. It moves at the same time when I move.
Three devices are: 1. iPhone 12 pro max IOS 14.3 Chrome for IOS 86.0.4240.93 / Firefox Daylight 34.0(4920)
iPhone 6s IOS 13.6.1 Safari
iPad Pro 11 inch 2019 cellular (with GPS) ipadOS 14.4 Chrome for ipadOS 90.0.4430.216 / Firefox Daylight 34.0(4920)
Best.
I experience this issue when deploying a modified version of the source of the location based tutorial Build your Location-Based Augmented Reality Web App. In my modifications I embed the iframe within an Ionic Framework component and add an a-image with static gps-entity-place to the a-scene within the iframe after the iframe 'load' event received. When deployed to my device the image "sticks" to the device as I move from the static position. My device information is listed below:
Phone model: Samsung Galaxy S10+ OS and version: Android 11 Browser and version: Android System WebView 94.0.4606.85 Approximate location (at country level): Hawaii, USA
Why use iframe? In Ionic why not just load AR js through npm?
On Wed, Oct 27, 2021 at 4:05 PM Tony C @.***> wrote:
I experience this issue when deploying a modified version of the source https://github.com/jeromeetienne/AR.js/tree/master/aframe/examples/click-places of the location based tutorial Build your Location-Based Augmented Reality Web App https://medium.com/chialab-open-source/build-your-location-based-augmented-reality-web-app-c2442e716564. In my modifications I embed the iframe within an Ionic Framework component and add an a-image with static gps-entity-place to the a-scene within the iframe after the iframe 'load' event received. When deployed to my device the image "sticks" to the device as I move from the static position. My device information is listed below:
Phone model: Samsung Galaxy S10+ OS and version: Android 11 Browser and version: Android System WebView 94.0.4606.85 Approximate location (at country level): Hawaii, USA
— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/AR-js-org/AR.js/issues/278#issuecomment-953345389, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAETNMODW6UD3UK5NQFNDJDUJBZSTANCNFSM45KPLMYA . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.
Thanks for the suggestion @raywu but I can't seem to find a tutorial that details how to do it in the way that you suggest with one of the popular javascript frameworks, e.g., Vue, Angular, React, etc., and one of the popular UI component frameworks, e.g., Ionic Framework, Vuetify, etc. Most tutorials either use an iframe or don't use a UI component framework and add the script imports from the iframe html into the main app index.html like in this codebase. I've tried the latter using a-scene, etc., in a Vue template within ion-content component but experienced an issue where a-scene is always a vertical strip like in this post.
Phone model: iPhone 12 Pro OS and version: iOS 15.1 Browser and version: Safari Approximate location: Denver Colorado
@acommend check out this: https://github.com/AR-js-org/AR.js/issues/234
Phone model: iPhone 12 OS and version: iOS 15.0.2 Browser and version: Safari Approximate location: Porto Alegre, Brazil Status: content sticking since initialization https://www.youtube.com/watch?v=rEe_g1lQLeo
Phone model: iPhone XR OS and version: iOS 14.8 Browser and version: Safari Approximate location: Porto Alegre, Brazil Status: everything okay, content not sticking https://youtu.be/tv1ihRY1V7w
Phone model: iPhone XR OS and version: iOS 15.1 Browser and version: Safari Approximate location: Florianópolis, Brazil Status: everything okay, content not sticking
@leonardoazzi ok many thanks. Wonder if it's anything to do with the iPhone 12? Not being an iPhone expert I'm not sure, but if anyone has any ideas please share them :-)
@leonardoazzi ok many thanks. Wonder if it's anything to do with the iPhone 12? Not being an iPhone expert I'm not sure, but if anyone has any ideas please share them :-)
@nickw1 that's my hypothesis too. And I hope that's just with the 12. I asked some colleagues to test with different iPhones and different iOS versions. We'll be happy to share with you to help solve the issue. :handshake:
Phone model: iPhone 12 OS and version: iOS 15.1.1 Browser and version: Safari Approximate location: Porto Alegre, Brazil Status: after updating from 15.0.2 to 15.1.1, everything okay, content not sticking anymore. :open_mouth: https://www.youtube.com/watch?v=i9ZPHaW8xxk
Upgrading to 15.1.1 didn’t make any difference for me.
@drewish could you test if it's still sticking using our app? https://d1z9m593h18c12.cloudfront.net/camera?mode=sim
Phone model: iPhone X OS and version: iOS 15.1.1 Browser and version: Safari Approximate location: Porto Alegre, Brazil Status: everything okay, content not sticking.
Phone model: iPhone SE OS and version: iOS 15.1 Browser and version: Safari Approximate location: Porto Alegre, Brazil Status: everything okay, content not sticking.
@leonardoazzi ok many thanks. Wonder if it's anything to do with the iPhone 12? Not being an iPhone expert I'm not sure, but if anyone has any ideas please share them :-)
@nickw1 that's my hypothesis too. And I hope that's just with the 12. I asked some colleagues to test with different iPhones and different iOS versions. We'll be happy to share with you to help solve the issue. handshake
Sorry, didn't mean to close, pressed wrong key
@leonardoazzi ok many thanks. Wonder if it's anything to do with the iPhone 12? Not being an iPhone expert I'm not sure, but if anyone has any ideas please share them :-)
@nickw1 that's my hypothesis too. And I hope that's just with the 12. I asked some colleagues to test with different iPhones and different iOS versions. We'll be happy to share with you to help solve the issue. handshake
@leonardoazzi many, many thanks :-) Thanks for your input so far, very useful.
Hi @leonardoazzi and others, do you want to try this new build of AR.js to see if it resolves this problem?
https://hikar.org/loc-fix/aframe-ar-nft.js
l have made some fixes with the way the Web Mercator coordinates are handled. It no longer stores them relative to the original position, but as absolute world coordinates.
I have also turned off the maximumAge
setting when watching the position, which has caused problems before. This may help.
Try using https://hikar.org/loc-fix/aframe-ar-nft.js as your AR.js source, and see if that works.
Note you will need to use gps-projected-camera
and gps-projected-entity-place
, not gps-camera
and gps-entity-place
.
Do you have a sample you have been testing against? I tried the above in some of my projects and still no luck getting geo to work. @nickw1. - might help if you could drop a glitch or codepen with an example.
I'm providing a bit more context. The model show sup but when regardless of if I use the proper GEO coordinate or not.
I've tested on iPhone 13 pro device safari & chrome
Here is what I noticed:
Hopefully we are getting close to solving this.
https://pmtest.glitch.me/test.html
Here is my code in case someone else wants to try it...
` <!DOCTYPE html>
`
Hi @Tonic3 this application is a good test: https://hikar.org/265/locfix.html
Download https://hikar.org/265/locfix.html and https://hikar.org/265/index.js, install these to your server, and then try out the example. It will use the 'loc-fix' version of AR.js which I mentioned above.
Wherever you are in the world (you do not need to provide your GPS coordinates), this will place a red box and a yellow box a short distance to your north. This is done dynamically using JavaScript.
To be honest I'm not too sure what the situation on Safari is: I don't have access to an iPhone or a Mac and I've heard rather variable reports for Safari. I think you need to agree to use the device sensors before it will work properly.
If you look at the location-based docs online https://ar-js-org.github.io/AR.js-Docs/ there is info on how to reduce 'shaking' effects, see https://ar-js-org.github.io/AR.js-Docs/location-based/#reducing-shaking-effects, but note the gpsMinTime
parameter will not work in this version as it's a little unreliable.
Hi all
I've tested: Samsung Note 8 with Chrome and I get the sticky boxes :( iPhone 13 Pro Max wih 15.2 on Edge and Safari and I get the sticky boxes :(
I too couldn't get this working yet :(
This is still present , no matter what example I use . None of the provided examples seem to do what they are supposed to do , even AR js studio , content either sticks to the camera or it doesnt scale
@CarloCattano if you checkout the latest dev
version of AR.js and try out the three.js location based example, does that work for you? It should show four boxes, a short distance to the north, south, east and west of you.
Guys is there any update? This is still a problem on iPhone 13!
Have you tried the new-location-based
components in AR.js 3.4.0? Have a look at the new-location-based
example and try this on your device. It should add four cubes a short distance to the north, south, east and west of your current position.
it still does not work!
Phone model: Samsung Galaxy M12 OS and version: Android 11 Browser and version: Chrome Approximate location: Ankara, Turkey Status: with location-based, content sticking to camera position. with new-location-based, nothing displaying in scene
Any news? Im having the same problem Phone model: Moto G9 OS and version: Android 11 Browser and version: Chrome Approximate location: Buenos Aires, Argentina Status: with location-based, content sticking to camera position. with new-location-based, nothing displaying in scene
I guess I found the problem with my device. It has neither gyro nor magnetic field sensor. So it can't get my cameras direction. (https://www.phonebunch.com/phone/samsung-galaxy-m12-4067/) AR.js works fine devices which has those sensors.
@CarloCattano if you checkout the latest
dev
version of AR.js and try out the three.js location based example, does that work for you? It should show four boxes, a short distance to the north, south, east and west of you.
This works for me, thanks!
Phone model: Samsung Galaxy M20 OS and version: Android 10 Browser and version: Chrome
Aframe Example from documentation still doesn't work
In this codePen where the object is added directly north: https://codepen.io/brynbeaudry/pen/qBMKjMN
3d Object cannot be seen. Phone model: iPhone 7 (All sensors supported) OS and version: iOs 15+ Browser and version: Chrome and Safari
Does this work on your phone outside?
@brynbeaudry not sure if this is an issue with the way Codepen works?
With your code on codepen, I get a message stating that deviceorientationabsolute
and WebXR are disallowed. I do not get this on standalone AR.js apps, e.g. https://hikar.org/webapp.
... this is only on a mobile device. On desktop your codepen example works fine.
I guess I found the problem with my device. It has neither gyro nor magnetic field sensor. So it can't get my cameras direction. (https://www.phonebunch.com/phone/samsung-galaxy-m12-4067/) AR.js works fine devices which has those sensors.
Not in my experience, I have a poko f5 with all of those: https://www.phonebunch.com/phone/xiaomi-poco-f5-5021/
And yet AR.js / my phone seems to get true north wrong constantly so nothing is ever correctly aligned.
I'm having the same problem. Objects appear to be placed relatively to where the camera is looking when opening the application. In my case, i have to turn the phone 90º over where the Y axis was at the beggining to find the objects. And they are stuck to the phone position.
I tried the aframe/examples/new-location-based/hello-world/index.html and I also tried adding an object north dynamically based on the first GPS position usin the code from the codepen left by brynbeaudry (note, I did not test it in the codepen, I've just grabbed the js from there and test it in my local deploy), got the same results. Also had a similar result with the ThreeJS example.
In this codePen where the object is added directly north: https://codepen.io/brynbeaudry/pen/qBMKjMN
Phone model: Samsung S23 OS and version: Android 13 Browser and version: Chrome (latest stable) Approximate location: Buenos Aires, Argentina
So for me this was a mix of
I'm using look controls for manual calibration, which is a shame but it is what it is.
<a-camera
fov-change
id="camera"
gps-new-camera="gpsMinDistance: 5; simulateLatitude: 51.5; simulateLongitude: -0.08; simulateAltitude: 400;"
far="1000000"
look-controls-enabled="true"
look-controls="enabled: true; magicWindowTrackingEnabled: true; touchEnabled: true; mouseEnabled: true"
>
I just raised an issue which is slightly different from this issue, but very much could be the same reason https://github.com/AR-js-org/AR.js/issues/566 Can someone check if its the same ?
Do you want to request a feature or report a bug?
Bug
What is the current behavior?
This issue is to discuss the behaviour originally documented in issue #265, and possibly elsewhere. Namely, on some devices, location-based content specified with gps-entity-place appears to 'stick' to the camera even if you move around.
If the current behavior is a bug, please provide the steps to reproduce.
Try going to this URL: (265 was the original issue number)
https://hikar.org/265/
What this is supposed to do, is automatically create two boxes a short distance to your north as soon as it gets a GPS position (wherever in the world you are)
If you walk away from your original position in directions other than north, the boxes should get smaller, but if you walk north, they should get bigger.
On some devices, this behaviour is not seen and instead the two boxes 'stick' to the camera.
As an initial step to try and diagnose the problem, could you report:
if the expected behaviour is not occurring.
What would be also good is if you could (if using Chrome on the mobile device) setup Chrome Developer Tools and see if any errors are reported: https://developer.chrome.com/docs/devtools/remote-debugging/
Thanks.
Please note that this is a new version of issue #275 which was closed due to clutter.
Please only use this issue to report this bug, or suggest ideas to resolve it. Please use the Discussions if you would like general support. Any irrelevant posts will be deleted (sorry, but this issue needs to be focused).