2013-03-23 171 views
3

我試圖從three.js修改this example以用鼠標單擊控制字符。首先,當我點擊畫布時,我需要鼠標座標並使用THREE.Raycaster.intersectObjects將其轉換爲三維空間座標。在修改後的代碼,在鼠標左鍵的時候,我有以下幾點:three.js Raycaster intersectObjects

var vector = new THREE.Vector3((event.clientX/window.innerWidth) * 2 - 1, -(event.clientY/window.innerHeight) * 2 + 1, 0.5); 
var projector = new THREE.Projector(); 
projector.unprojectVector(vector, camera); 

var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize()); 

var intersects = raycaster.intersectObjects(objects); 

if (intersects.length > 0) { 
    console.log('intersect: ' + intersects[0].point.x.toFixed(2) + ', ' + intersects[0].point.y.toFixed(2) + ', ' + intersects[0].point.z.toFixed(2) + ')'); 
} 
else { 
    console.log('no intersect'); 
} 

我已經加入了地面網的objects陣列,但是當我點擊地面網raycaster.intersectObjects仍返回空數組。我也試過scene.children而不是objects,但沒有運氣。

這裏是full modified source

回答

2

顯然,陀螺儀是問題所在。拿出這些線,我得到相交工作。不確定這是一個錯誤還是功能。

var gyro = new THREE.Gyroscope(); 
gyro.add(camera); 
characters[ Math.floor(nSkins/2) ].root.add(gyro);