Unable to touch THREE.CSS3DObject object when using touch devices in THREE.OrthographicCamera

Questions
,
1

Hi there,

I just create a station indoor map and works nicely using desktop browser but when using mobile devices browser i got issue when trying to click some THREE.CSS3DObject.

Live implementation : http://asw.web.id/project/virtuviz/
Please click a lot icon like the spinning toilet icon then a popup will appear.
it works well in desktop browser
it doesn’t work in mobile browser

Any clue will be appreciated, thank you

Regards,
Git

2

Is there anyone that having the same issue?

3

I can reproduce but I don’t think this issue. Can you please manually add an event listener to the respective HTML element and check if the reacts on the touchstart event? Maybe there is an issue with your used Tipped library.

4

I just removed all Tipped plugin and replaced it with a simple js alert(), but still in mobile browser i cannot touch the object.

5

You do this right now:

e.setAttribute("onclick", "alert('hi there')");

Can you also add an event listener to the touchstart event? Besides, I would write the code like so:

e.addEventListener( 'touchstart', ( event ) => {

    console.log( event );

}, false );
6

thanks, the addEventListener is the solution