如何在三个 JS 中点击移动设备？

Question

我使用DomEvents library 来点击场景中的元素。

我创建元素：

domEvents = new THREEx.DomEvents(camera, renderer.domElement);
material0 = new THREE.MeshBasicMaterial({ 
 transparent: true,
 opacity: 0,
 map: runnerTexture, 
 side: THREE.DoubleSide,
 depthWrite: false
});
mesh_un[3] = new THREE.Mesh( geometry0, material0 );
mesh_un[3].name = 'obj3';
mesh_un[3].position.set(-1200, 7200, 5800);
mesh_un[3].add(new THREE.Mesh( geometry, material ));

然后添加事件：

domEvents.addEventListener(element, touchEvent, function(event) {
 console.log(event);
 page.popup(index);
 return true;
});

它们在台式机上运行良好，但在移动设备上不可用。

是图书馆的问题还是在我的场景中？ 如何让点击在所有设备上都能正常运行？

演示：http://cavsys.ru/o-tehnologii/fizicheskij-uroven/

Answer 1

我使用这样的东西：

this.init = function (picker) {
    camera = GameScene.getCamera()
    container = GameRenderer.getDomElement()

    container.addEventListener('mousedown', picker.onContainerMouseDown, false)
    container.addEventListener('mousemove', picker.onContainerMouseMove, false)
    container.addEventListener('mouseup', picker.onContainerMouseUp, false)
    container.addEventListener('mouseout', picker.onContainerMouseOut, false)


    container.addEventListener('touchstart', picker.onContainerTouchStart, true)
    container.addEventListener('touchmove', picker.onContainerTouchMove, true)
    container.addEventListener('touchend', picker.onContainerTouchEnd, true)
    container.addEventListener('touchcancel', picker.onContainerTouchEnd, true)
}

和

this.onContainerTouchStart = function (event) {
    event.offsetX = event.changedTouches[0].clientX
    event.offsetY = event.changedTouches[0].clientY

    handleDownStart(event)
}
this.onContainerMouseMove = function (event) {
    if (Page.hasTouch()) {
        return
    }
    handleMove(event)
}
this.onContainerTouchMove = function (event) {
    event.offsetX = event.changedTouches[0].clientX
    event.offsetY = event.changedTouches[0].clientY

    handleMove(event)
}
this.onContainerMouseUp = function (event) {
    if (Page.hasTouch()) {
        return
    }
    //console.log('up')
    event.preventDefault()
    dragStart = 0
}
this.onContainerMouseOut = function (event) {
    event.preventDefault()
    dragStart = 0
}
this.onContainerTouchEnd = function (event) {
    //console.log('touchEnd')
    dragStart = 0
}

您可以在此处查看完整代码：https://jsfiddle.net/brbfdLo5/1/