Is the current version of model-viewer compatible with wall placement in AR?

[kaboomlaser]

The most recent release of google's  model-viewer allows for placement of objects on walls in AR using the 'ar-placement="wall" ' tag.   https://modelviewer.dev/examples/augmentedreality/#wall 

I added this tag to the media.liquid snippet but the  model-viewer in shopify won't allow placement on walls.   https://kaboomlaser.com/products/test 

html code from modelviewer.dev:

<model-viewer src="../../assets/boom_2_.glb" ar="" ar-placement="wall" camera-controls="" alt="A 3D model of some wall art" data-js-focus-visible="" ar-status="not-presenting"></model-viewer>

html code from my shopify page:

<model-viewer ar-placement="wall" reveal="auto" toggleable="true" data-model-id="8179632013417" src="https://model3d.shopifycdn.com/models/o/3e6915dbe4fa8411/boom_2_.glb" camera-controls="true" data-shopify-feature="1.2" alt="Test" poster="//cdn.shopify.com/s/files/1/0290/5459/9273/products/boom_2_530x530.jpg?v=1605816132" class="" tabindex="0" data-js-focus-visible="" ar-status="not-presenting"></model-viewer>

As the tags are pretty much the same and the file is the same, I suspect shopify uses an older version of model-viewer.   Is this correct?   When can we expect an upgrade?  Or how can I get this to work aonther way?

[vikfromlevar]

Hi @kaboomlaser 

Depends, lot of variables here. Are you trying to place something on the wall via an Android GLB and an iOS Quicklook? How is your glb oriented in world space?

According the Shopify's own language - <model-viewer> is being pulled straight from Google itself, so it's interesting that the feature doesn't work. What does your model viewer import look like? Let me know what's up with your GLB and what device you're using - I'd be happy to diagnose further. 

In the interim, we've been able to achieve wall tracked AR assets through our own Shopify App and custom viewer - I think this may address your needs as well.

[Prorez]

I've had a similar issue with regards to shopify's model-viewer library not being updated with model-viewer's latest features. For example, the disable-zoom data attribute is not currently supported on the shopify's model-viewer v1.2  but if you check out google's latest model-viewer cdn , it's there. Shopify needs to pay more attention and sync to google's model-viewer latest features. Hope someone from Shopify sees this and fixes this asap.

The only solution I can think of is to import google's official cdn manually, instead of relying on shopify's library for now. P.S. make sure to remove that data-shopify-feature="1.2" from your model-viewer tag, that automatically imports shopify's library.

<script async type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script>