2014-11-23 245 views
0

我創建了一些幾何圖形和一些函數來移動和檢測它。 它的工作原理非常完美,但現在我已經將它插入到JavaScript UI庫http://dhtmlx.com/中,並且效果不佳。問題是這樣的:例如使用raycaster,當幾何體不在鼠標下時,它也會找到幾何體的交點。它看起來像所有的幾何形狀都從原來的位置上移,繪製是一個假的。Three.js十字路口raycaster

我在這個網址做了個例子:http://www.felpone.netsons.org/web-threejs%20-%20Copia/contact_manager/prova2.html。您可以在控制檯中看到完整的代碼。

正如您在現場示例中所看到的,如果您在上方單擊,也可以拖動該多維數據集。

回答

0

我認爲它是因爲鼠標座標是文檔座標,而不是畫布中的座標。

在我的應用我確定射線像這樣正確的座標:

var mouseX = event.clientX - myCanvas.offsetLeft; 
var mouseY = event.clientY - myCanvas.offsetTop; 

var mouseXForRay = (mouseX/this.canvas.width) * 2 - 1; 
var mouseYForRay = -(mouseY/this.canvas.height) * 2 + 1; 
+0

myCanvas由ID帆布ID得到了什麼? @kovacsv – stefano 2014-11-23 21:41:47

+0

是的,你可以通過id獲取畫布。 – kovacsv 2014-11-24 06:31:00

+0

我建議您將鼠標事件偵聽器附加到畫布上,而不是文檔。 – kovacsv 2014-11-24 06:39:43