three.js滑鼠互動

標籤：變化   dev   方向   work   project   使用者   使用   https   哪些   

使用 2D 滑鼠在 3D 情境中拾取對象

3D 的另一個重要的使用者互動技術是對象拾取，即 3D 情境中的對象選擇。輸入裝置是一個 2D 滑鼠，使用者實際單擊的是在其中渲染 3D 情境的畫布。因為當使用者周繞情境運動時，渲染會發生變化，必須將滑鼠的 2D 座標動態地（在按一下滑鼠時）映射到情境的三維座標空間，以確定哪些對象被選中。

在 2D 圖形中，通過點擊測試 來執行滑鼠選擇。對象拾取是 3D 中的一種點擊測試形式。Three.js 通過提供一個 projector 輔助程式來簡化對象拾取，它可以從 2D 畫布 (x,y) 點過渡到情境的 3D 世界，同時還會考慮到當前攝像機的屬性（攝像機所指的方向和角度等）。

Three.js 也有一個 RayCaster 類，可以將光線投射到 3D 情境中，並確定光線是否與情境中指定的 3D 對象集合相交。

在螢幕更新期間執行點擊測試。滑鼠移動事件偵聽程式會將滑鼠的 x 和 y 座標儲存為一個全域變數。

Three.js提供一個射線類Raycasting來拾取情境裡面的物體。更方便的使用滑鼠來操作3D情境。

參考1：http://blog.csdn.net/u014658748/article/details/51074840

參考2：https://www.ibm.com/developerworks/cn/web/wa-webgl3/

three.js滑鼠互動