Discrepancy in Object Positions between JSON Scene Data and Surface/Marker Tracking Scene build dynamically

We’re encountering a puzzling issue with our augmented reality project involving surface and marker tracking. Our scenario involves saving scenes created through our custom authoring tool in JSON format, capturing details such as object meshes and their positions in x, y, z coordinates. However, upon loading these scenes onto surfaces or markers, we’ve observed significant discrepancies in the object positions compared to those stored in the JSON data.

Our primary objective is to construct 3D objects with interactive hotspots for user engagement. The sample JSON data generated by our authoring tool illustrates the structure and properties of these objects.

[{“id”:1,“name”:“Scene 1”,“meshObjects”:[{“id”:“1000”,“name”:“new 3D object”,“sceneId”:1,“meshType”:“gltf”,“isLock”:false,“position”:{“x”:-2.1737213134765625,“y”:1.836345911026001,“z”:0.6391922831535339},“rotation”:{“x”:0,“y”:0,“z”:0},“scale”:{“x”:0.97,“y”:1.26,“z”:0.62},“mediaUrl”:“content/media/e2fb6cd2-4ab7-42dd-addd-5cd3a21c6fe8/scene.gltf”,“replace”:false,“mediaName”:“realistic_human_heart.zip”,“triggerEvent”:“”,“targetobjectId”:“”,“actionType”:“”,“actionData”:{},“isObjectVisible”:true,“objectInteraction”:“”,“chatbot”:{“avatgt”:“”,“avalink”:“”,“avabot”:“”,“avaaction”:“”,“hotspotUrl”:“”,“hotspotColor”:“”,“bgColor”:“”,“transparency”:0,“isBorder”:false,“borderColor”:“”,“tatc”:“”},“avatarSettings”:{“isMsgProp”:“”,“pos”:{“x”:“”,“y”:“”,“z”:“”},“rot”:{“x”:“”,“y”:“”,“z”:“”},“scl”:{“x”:“”,“y”:“”,“z”:“”},“textColor”:“”,“bgColor”:“”,“transparency”:0,“isBorder”:“”,“borderColor”:“”}},{“id”:“1001”,“name”:“new hotspot”,“sceneId”:1,“meshType”:“hotspot”,“isLock”:false,“position”:{“x”:-2.233163833618164,“y”:2.829935312271118,“z”:-0.2509578764438629},“rotation”:{“x”:0,“y”:0,“z”:0},“scale”:{“x”:0.4,“y”:1,“z”:0.77},“mediaUrl”:“assets/img/round-shap/index1.svg”,“replace”:false,“objectSettings”:{“transparency”:0,“isBackground”:false,“backgroundColor”:“”,“isBorder”:false,“borderColor”:“”,“borderWidth”:“”,“hotspotColor”:“#ddb00e”,“radius”:“”,“textColor”:“”,“textStyle”:“”,“height”:“”,“width”:“”,“fontSize”:“”,“autoPlay”:“”},“isObjectVisible”:true,“triggerEvent”:“on_tap”,“actionType”:“display_message”,“actionData”:{“displayMassage”:{“dmsg”:“Cloud-based Instancy Learning Platform enables the creation, management and delivery of online training and education”,“transparency”:0,“textColor”:“”,“backgroundColor”:“”,“borderColor”:“”}},“chatbot”:{“avatgt”:“”,“avalink”:“”,“avabot”:“”,“avaaction”:“”,“hotspotUrl”:“”,“hotspotColor”:“”,“bgColor”:“”,“transparency”:0,“isBorder”:false,“borderColor”:“”,“tatc”:“”},“avatarSettings”:{“isMsgProp”:“”,“pos”:{“x”:“”,“y”:“”,“z”:“”},“rot”:{“x”:“”,“y”:“”,“z”:“”},“scl”:{“x”:“”,“y”:“”,“z”:“”},“textColor”:“”,“bgColor”:“”,“transparency”:0,“isBorder”:“”,“borderColor”:“”}},{“id”:“1002”,“name”:“new hotspot”,“sceneId”:1,“meshType”:“hotspot”,“isLock”:false,“position”:{“x”:-1.9708657264709473,“y”:1.5484694242477417,“z”:0.11881710588932037},“rotation”:{“x”:0,“y”:0,“z”:0},“scale”:{“x”:0.66,“y”:0.53,“z”:1},“mediaUrl”:“assets/img/round-shap/index1.svg”,“replace”:false,“objectSettings”:{“transparency”:0,“isBackground”:false,“backgroundColor”:“”,“isBorder”:false,“borderColor”:“”,“borderWidth”:“”,“hotspotColor”:“#ddb00e”,“radius”:“”,“textColor”:“”,“textStyle”:“”,“height”:“”,“width”:“”,“fontSize”:“”,“autoPlay”:“”},“isObjectVisible”:true,“triggerEvent”:“on_tap”,“actionType”:“link_to_URL”,“actionData”:{“url”:“https://www.google.com”},“chatbot”:{“avatgt”:null,“avalink”:null,“avabot”:null,“avaaction”:null,“hotspotUrl”:null,“hotspotColor”:null,“bgColor”:null,“transparency”:null,“isBorder”:null,“borderColor”:null,“tatc”:null},“avatarSettings”:{“isMsgProp”:null,“pos”:{“x”:null,“y”:null,“z”:null},“rot”:{“x”:null,“y”:null,“z”:null},“scl”:{“x”:null,“y”:null,“z”:null},“textColor”:null,“bgColor”:null,“transparency”:null,“isBorder”:null,“borderColor”:null}},{“id”:“1003”,“name”:“new video”,“sceneId”:1,“meshType”:“video”,“isLock”:false,“position”:{“x”:1.8371280431747437,“y”:1.722477912902832,“z”:0.10000000149011612},“rotation”:{“x”:0,“y”:0,“z”:0},“scale”:{“x”:0.23,“y”:0.28,“z”:1},“mediaUrl”:“content/media/2051/en-us/4037ed27-d3d6-4709-ae4e-2da62e1b8474.mp4”,“mediaName”:“AI Video with Augumented”,“type”:“”,“replace”:false,“objectSettings”:{“transparency”:0,“isBackground”:false,“backgroundColor”:“”,“isBorder”:false,“borderColor”:“”,“borderWidth”:“”,“hotspotColor”:“”,“radius”:“”,“textColor”:“”,“textStyle”:“”,“height”:“”,“width”:“”,“fontSize”:“”,“autoPlay”:false},“isObjectVisible”:true,“actionData”:{},“chatbot”:{“avatgt”:“”,“avalink”:“”,“avabot”:“”,“avaaction”:“”,“hotspotUrl”:“”,“hotspotColor”:“”,“bgColor”:“”,“transparency”:0,“isBorder”:false,“borderColor”:“”,“tatc”:“”},“avatarSettings”:{“isMsgProp”:“”,“pos”:{“x”:“”,“y”:“”,“z”:“”},“rot”:{“x”:“”,“y”:“”,“z”:“”},“scl”:{“x”:“”,“y”:“”,“z”:“”},“textColor”:“”,“bgColor”:“”,“transparency”:0,“isBorder”:“”,“borderColor”:“”}}],“sceneType”:2,“mediaName”:“download.jpg”,“mediaUrl”:“content/media/2183/en-us/4b7a1e72-d6f9-4ac5-906b-434121c0f30e.jpg”}]

Code URL: Ar Tracking_Sample.zip - Google Drive

Output sample we are getting:

We’re seeking assistance from the community to diagnose and address this issue. Any insights, guidance, or potential solutions would be immensely appreciated.

Thank you sincerely,
Srinivas

One thing you can do to get more help is to reproduce the problem in the Playground

this code is build using blippar and babylonjs. So it won’t work directly on babylonjs playground.
You can preview code from URL below: Babylon.js WebAR SDK

Yes but we don’t debug in user code unfortunately:)

Help us helping you please

Here is the playground link requested:

Cc @RaananW if you don’t mind having a look for me?

1 Like

Would be very helpful to understand what I am seeing (or not seeing TBH :slight_smile: ). What are the steps to reproduce the issue? It’s a lot of code and an empty scene.

Is the issue the hit-test positioning?

1 Like