在坐標 3D object model in Three.js 上放置一個點

Question

我正在構建一個 Three.js 應用程序（React 模板，如果它很重要）。 我有這個 3D object model 應該像應用程序中的 Pl.net 地球一樣。 我有這個空間站 model。我想通過每隔一秒給出一些特定坐標來圍繞世界旋轉空間站。 我的問題是：

我怎樣才能把空間站放在倫敦上方，例如，如果我有這個坐標：
long: 45.926013877299和lat: 46.524648101056 （隨機）

這是我加載 object 的方式：

const loader = new GLTFLoader();

loader.load("path/to/model", function (gltf) {
  scene.add(gltf.scene);
});

Answer 1

Vector3 有一個名為Vector3.setFromSphericalCoords(radius, phi, theta)的方法。 您可以使用它來將您的距離、緯度和經度轉換為空間中的 X、Y、Z 點：

const radius = 100; // Distance from center of Earth

const polar = 180 - (lat + 90);
const phi = THREE.MathUtils.degToRad(polar);
const theta = THREE.MathUtils.degToRad(long);

mesh.position.setFromSphericalCoords(radius, phi, theta);

// Final result
console.log(mesh.position.toArray());

請注意，我必須更改緯度的值。 這是因為phi在北極測量為 0°，在南極測量為 180°。