如何在ThreeJS中點擊移動設備？

我使用DomEvents library來點擊場景中的元素。如何在ThreeJS中點擊移動設備？

創建eleemets：

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; 
});

他們工作在桌面非常好，但是沒有工作在移動設備上。

是圖書館的問題還是我的場景？如何使點擊在所有設備上都能正常工作？

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

來源

2017-02-15 skywind

選中iPad mini + iOS10.2.1 + Chrome：點擊紅點結果顯示其他模型+文本欄+視頻。它預期的行爲？此外，來自DomEvents官方網站的例子運行良好。 – prisoner849

我用的是這樣的：

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/

來源

2017-02-15 16:43:02

如何在ThreeJS中點擊移動設備？

回答

相關問題