CODEWITHSUNDEEP
javascripthtmlthree.jsaugmented-reality
aryanknp
aryanknp

Reputation: 1167

How to select tapped model three.js webxr

I am implementing rotation functionality to models added to the scene in ar (webxr) , currently I implement it only on the recently added model but I want to let user do it with any model present so I need to select the tapped model(I use touchstart event for this) , I use raycaster and check if intersection to object but it not works , do I need to update camera ? or what , here is the code:

// loc is vec2d , I add rotation to model in rotatemodel
renderer.domElement.addEventListener('touchstart',function(e){
                    e.preventDefault();
                    touchDown=true;
                    touchX = e.touches[0].pageX;
                    touchY = e.touches[0].pageY;

                loc.x = touchX ;
                loc.y = -  touchY;

                raycaster.setFromCamera( loc , camera );

                const intersects = raycaster.intersectObjects( scene.children );

                if ( intersects.length > 0 ) {

                    if ( rotatemodel != intersects[ 0 ].object ) {

                        rotatemodel = intersects[ 0 ].object;

                    }

                } 
                },false)

Upvotes: 2

Views: 480

Answers (1)

Mugen87
Mugen87

Reputation: 31076

Touch events like touchstart are disabled by the browser when entering immersive mode via WebXR. So you can't use them to implement interactivity in your app.

More information in: Chrome on android: touchevent not work on a-entity click

Upvotes: 1

Related Questions