ThreeJS：Raycasts在某些計算機上關閉

我一直在做一個ThreeJS項目並使用光線投影與畫布內的對象進行區域間的切換。我有4臺電腦來測試它，所有更新最新回購。ThreeJS：Raycasts在某些計算機上關閉

在其中一臺計算機上，光線投射離開了鼠標所在的位置......我不知道是什麼導致它與其他人的行爲不同。

任何想法？

代碼：

// Performs a Raycast for Ortho camera type 
PerformOrthographicRaycast: function (event, canvas, renderer, camera, objects) { 
    var vector = new THREE.Vector3(0, 0, 0); 
    var dir = new THREE.Vector3(0, 0, 0); 
    vector.x = ((event.clientX - canvas.getBoundingClientRect().left)/renderer.domElement.width) * 2 - 1; 
    vector.y = -((event.clientY - canvas.getBoundingClientRect().top)/renderer.domElement.height) * 2 + 1;; 
    vector.z = -1; // z = - 1 important! 

    vector.unproject(camera); 

    dir.set(0, 0, -1).transformDirection(camera.matrixWorld); 

    this._Raycaster.set(vector, dir); 
    var intersects = this._Raycaster.intersectObjects(objects, true); 

    if (intersects.length) { 
     return intersects; 
    } 
    else 
     return null; 
},

來源

2014-12-05 Yenza

我發現問題出在Windows的「放大」或「縮放」用戶可以在他們的主題設置中設置。

在渲染器中，您可以找到在縮放比例發生變化時被修改的像素比率。以下解決方案適用於我：

vector.x = renderer.devicePixelRatio * ((event.clientX - canvas.getBoundingClientRect().left)/renderer.domElement.width) * 2 - 1; 
vector.y = renderer.devicePixelRatio * -((event.clientY - canvas.getBoundingClientRect().top)/renderer.domElement.height) * 2 + 1;;

來源

2015-03-25 08:36:46 Yenza

看到這個example。查看控制檯中的消息。

<script src="js/controls/EventsControls.js"></script> 

EventsControls = new EventsControls(camera, renderer.domElement); 
EventsControls.draggable = false; 

EventsControls.mouseOver = function() { 
    this.container.style.cursor = 'pointer'; 

    this.mouseOvered.currentHex = this.mouseOvered.material.emissive.getHex(); 
    this.mouseOvered.material.emissive.setHex(0xff0000); 

    console.log('the key at number ' + this.mouseOveredItem + ' is select');       
} 

// 

var mesh = new THREE.Mesh(geometry, material); 
scene.add(mesh); 

EventsControls.attach(mesh); 

// 

function render() { 
     EventsControls.update(); 
     controls.update(); 
     renderer.render(scene, camera); 
}

來源

2014-12-14 11:57:27

ThreeJS：Raycasts在某些計算機上關閉

回答

相關問題