Three.js自定義幾何raycaster捕獲錯誤的對象

我需要使用我自己的gemetry，因爲默認的多維數據集看起來不像應該以線框模式（現在它由三角形而不是正方形組成）。Three.js自定義幾何raycaster捕獲錯誤的對象

所以我做了我自己的幾何圖形，它看起來沒問題，但raycaster對於我自己的對象不如使用內置立方體那樣好。

var cube = new THREE.Line(getCube(5,5, 5), new THREE.LineDashedMaterial({ color: 0x000000,dashSize: 1, gapSize: 0.1, linewidth: 2 }),THREE.LinePieces);

其中getCube（）返回

var geometry = new THREE.Geometry()

見例如：在頂部 http://jsfiddle.net/QHjSM/12/

6色填充框是defalt THREE.CubeGeometry盒，並與raycaster選擇他們的作品完美，6線框是我的自定義幾何。

發佈：如果您嘗試單擊框外，但非常靠近它，它會捕獲框，如果您在框中單擊（在它的中間）它也不會捕獲它。

但最令人討厭的是，如果你在一個盒子裏麪點擊，但是接近另一個盒子，有時候它卻沒有發現錯誤。

我不確定能不能做得更好，嘗試了所有的geometry.compute ...方法，但仍然沒有效果。

來源

2013-10-01 Kamil Maciejewski

美好的一天，您的自定義立方體實際上不是立方體。它們只是一堆沒有相應面的線條。由於你的「立方體」確實存在漏洞，所以你的選擇沒有按預期返回。你可以在getCube函數中創建頂點，然後以類似的方式構建所有的面。

有一個看看這個例子：Issue with custom geometry and face normal

一般來說，你需要仔細模式每3組頂點，這樣當你在順時針方向打造的面孔出現，這樣法線會電腦正確。以下是添加面部的基本示例。

geometry.faces.push(new THREE.Face3(1,2,3));

但是！請注意，這將導致上述對角線貫穿線框。因此，爲了您的使用情況，爲什麼不簡單地使用基本立方體網格與拾取並移除線框，然後將線繪製的框疊加爲您的自定義線框。兩全其美。你可能已經知道了，但是Face4已經不存在了，所以你需要使用Face3和某種自定義線框來完成這個任務。

編輯：我對你的小提琴做了一個小測試，發現了一些奇怪的東西。使用CanvasRender，即使在默認多維數據集的線框下，仍然可以看到對角線！我嘗試WebGLRenderer，它很好。我必須進一步研究這一點。

CanvasRenderer http://jsfiddle.net/QHjSM/13/

WebGLRenderer http://jsfiddle.net/QHjSM/14/

再次

我，嗯看來那些幻影的臉線在上三用MeshBasicMaterial所有CanvasRenderer例子可見。js網站。我能做的唯一事情就是簡單地將立方體網格材料的不透明度降低到0.1以減少影響。我想唯一的另一種方法是切換到WebGLRenderer，但我期待着成爲錯了就這樣:)這裏的最後一次測試

http://jsfiddle.net/QHjSM/16/

來源

2013-10-01 12:11:41

更多的是解決辦法，而不是解決真正的問題，但它的工作原理，所以如果我找不到一些直接的解決方案，我會使用你的。謝謝 –

事實上，這是一種解決方法。 CanvasRenderer自己讓我有點吃驚。我假設你在材質中使用了'wireframe：true'，但令我驚訝的是不是這種情況 –

啊我發現了，這裏是從r59到r60的移除線程，其中四邊形被移除。你會發現這個解決方案建議是我們在這裏偶然發現的：https：//github.com/mrdoob/three.js/issues/3788 –

Three.js自定義幾何raycaster捕獲錯誤的對象

回答

相關問題