WebGL學習筆記(十三):拾取

目前爲止,咱們尚未涉及到交互相關的內容,實際上,咱們是須要知道咱們點擊的地方下面的第一個物體的信息,這個過程稱爲拾取。html

簡單拾取實現

咱們能夠經過顏色來獲取是否成功點擊,具體方式以下:git

  1. 場景中有一個立方體;
  2. 鼠標點擊以後,立方體變成紅色的立方體;
  3. 判斷鼠標點擊的像素顏色是不是紅色,若是是則表示點中了立方體,不是則表示沒有點中;
  4. 恢復立方體的顏色爲原來的顏色;

示例請點擊:https://hammerc.github.io/dou3d-ts/examples/learningNotes/lesson_14/PickObject.htmlgithub

拾取指定的面

上面的例子已經能夠實現拾取整個立方體,咱們但願能夠拾取指定的一個面,採用的方式仍然同上,有一點區別以下:less

  1. 場景中有一個立方體;
  2. 鼠標點擊以後,立方體變成每一個面都有不一樣透明度的立方體;
  3. 判斷鼠標點擊的像素透明度,能夠知道點中了立方體的哪一個面;
  4. 被點中的立方體的那個面繪製爲白色;

示例請點擊:https://hammerc.github.io/dou3d-ts/examples/learningNotes/lesson_14/PickFace.html3d

相關文章
相關標籤/搜索