Three.js獲得世界座標.getWorldPosition()

Three.js獲得世界座標.getWorldPosition()

本文是Three.js電子書的6.3節

通過前兩節課的學習相比你對Threejs的層級模型有了一定認識,那麼本節課就在層級模型概念的基礎給家建立本地座標系和世界座標系的概念。

如果你對本地座標系和世界座標系已經有了一定概念,那麼可以直接訪問模型的位置屬性.position獲得模型在本地座標系或者說模型座標系下的三維座標,通過模型的.getWorldPosition()方法獲得該模型在世界座標下的三維座標。

.getWorldPosition()方法

模型對象的方法.getWorldPosition()方法和位置屬性.position一樣繼承自基類Object3D

// 聲明一個三維向量用來保存世界座標
var worldPosition = new THREE.Vector3();
// 執行getWorldPosition方法把模型的世界座標保存到參數worldPosition中
mesh.getWorldPosition(worldPosition);

建立世界座標系概念

如果你沒有本地座標系和世界座標系的概念,可以通過下面的案例源碼很快的建立兩個座標系的概念。

你首先在案例中測試下面源碼,通過位置屬性.position.getWorldPosition()分別返回模型的本地位置座標和世界座標,查看兩個座標x分量有什麼不同。你可以看到網格模型mesh通過位置屬性.position返回的座標x分量是50,通過.getWorldPosition()返回的座標x分量是100,也就是說mesh的是世界座標是mesh位置屬性.position和mesh父對象group位置屬性.position的累加。

var mesh = new THREE.Mesh(geometry, material);
// mesh的本地座標設置爲(50, 0, 0)
mesh.position.set(50, 0, 0);
var group = new THREE.Group();
// group本地座標設置和mesh一樣設置爲(50, 0, 0)
// mesh父對象設置position會影響得到mesh的世界座標
group.position.set(50, 0, 0);
group.add(mesh);
scene.add(group);

// .position屬性獲得本地座標
console.log('本地座標',mesh.position);

// getWorldPosition()方法獲得世界座標
//該語句默認在threejs渲染的過程中執行,如果渲染之前想獲得世界矩陣屬性、世界位置屬性等屬性,需要通過代碼更新
scene.updateMatrixWorld(true);
var worldPosition = new THREE.Vector3();
mesh.getWorldPosition(worldPosition);
console.log('世界座標',worldPosition);

總結

下面對上面的案例實驗進行總結。

所謂本地座標系或者說模型座標系,就是模型對象相對模型的父對象而言,模型位置屬性.position表示的座標值就是以本地座標系爲參考,表示子對象相對本地座標系原點(0,0,0)的偏移量。

前面兩節課說過Threejs場景Scene是一個樹結構,一個模型對象可能有多個父對象節點。世界座標系默認就是對Threejs整個場景Scene建立一個座標系,一個模型相對世界座標系的座標值就是該模型對象所有父對象以及模型本身位置屬性.position的疊加。

本地縮放係數.scale

通過前面的論述,模型的位置屬性.position可以稱爲本地座標或者說局部座標,對於屬性.scale一樣,可以稱爲模型的本地縮放係數或者局部的縮放係數,通過.getWorldScale()方法可以獲得一個模型的世界縮放係數,就像執行.getWorldPosition()方法一樣獲得世界座標,關於.getWorldScale()方法可以查看基類Object3D

本地矩陣.materix和世界矩陣.matrixWorld

如果你對WebGL頂點的旋轉、縮放、平移矩陣變換有一定的瞭解,可以繼續閱讀,如果沒有概念也可以暫時跳過。

本地矩陣.materix是以本地座標系爲參考的模型矩陣,世界矩陣.matrixWorld自然就是以是世界座標系爲參照的模型矩陣。Three.js本地矩陣是

Three.js模型的位置屬性.position、縮放係數屬性.scale和角度屬性.rotation記錄了模型的所有平移、縮放和旋轉變換,本地矩陣.materix是以線性代數矩陣的形式表示.position.scale.rotation。世界矩陣.matrixWorld自然是用矩陣的形式表示模型以及模型父對象的所有旋轉縮放平移變換。更多內容可以參考文章《本地矩陣和世界矩陣》

發佈了141 篇原創文章 · 獲贊 25 · 訪問量 5萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章