2017-02-27 105 views
0

我有一個討厭的問題,我的光線投射與鼠標,但沒有觸摸罰款。Three.js Raycaster使用鼠標不與觸摸

我設置事件,這樣

$(document).bind('mousedown', onDocumentMouseDown); 
    $(document).bind('mousewheel', onDocumentMouseWheel); 
    $(document).bind('touchstart', onDocumentTouchStart); 
    $(document).bind('touchmove', onDocumentTouchMove); 

我的鼠標事件

function onDocumentMouseDown(e) { 

    e.preventDefault(); 
    detectHotspotClick(e.pageX,e.pageY); 

} 

我的觸摸事件

function onDocumentTouchStart(e) { 

    e.preventDefault(); 

    var event = e.originalEvent; 

    if (event.touches.length == 1) { 
     var t=event.touches[0]; 
     draggingY = t.pageY; 
     detectHotspotClick(t.pageX,t.pageY); 
    } 

    if (event.touches.length == 2) { 

     var dx = event.touches[ 0 ].pageX - event.touches[ 1 ].pageX; 
     var dy = event.touches[ 0 ].pageY - event.touches[ 1 ].pageY; 
     _touchZoomDistanceEnd = _touchZoomDistanceStart = Math.sqrt(dx * dx + dy * dy); 

    } 
} 

My檢測

function detectHotspotClick(x,y){ 

    console.log('detectHotspotClick('+ x + "," + y+ ")"); 

    var raycaster = new THREE.Raycaster(); 
    var mouse = new THREE.Vector2(); 

    mouse.x = (x/renderer.domElement.width) * 2 - 1; 
    mouse.y = - (y/renderer.domElement.height) * 2 + 1; 

    raycaster.setFromCamera(mouse, camera); 

    var intersects = raycaster.intersectObjects(targetList, true); 

    if (intersects.length > 0) 
     hotspotClick(intersects[ 0 ].object); 
} 

這對鼠標工作正常,但我注意到觸摸,mouse.x值總是似乎是negetative,我不知道這是正確的。

有沒有其他方法可以做到這一點我應該考慮?

回答

0

不知道爲什麼..但它可以在touchevent上使用detectHotspotClick(t.pageX * 2,t.pageY * 2),它必須向鼠標事件報告不同的數字。