如何將相機的位置合並到此算法中以計算精靈在屏幕上的位置？

Question

我正在研究3D空間中的2D渲染系統。 精靈是2D的，但它們是在3D空間中渲染的。 “相機”可以在3D空間中移動並水平旋轉360度。 我在根據相機的位置/旋轉度以及資產在屏幕上應存在的位置，找出正確的公式進行計算時遇到了麻煩。

我所擁有的是這樣的：

chunk.assets.forEach(asset => {
    let x = Math.round(
      asset.coords.x * Math.cos(angle) - asset.coords.y * Math.sin(angle)
    );
    let y = Math.round(
      asset.coords.y * Math.cos(angle) + asset.coords.x * Math.sin(angle)
    );
    if (!depthMap[y]) {
      depthMap[y] = [];
    }
    depthMap[y].push(asset);
});

但這不考慮攝像機（玩家）的位置（存儲在player.coords.x, player.coords.y ），僅考慮攝像機/玩家面對的angle （ angle ）。 因此，現在相機無法移動。 注意：深度圖只是按順序存儲資產，因此渲染器知道渲染精靈的順序，以便根據哪個更接近播放器/相機，事物以正確的順序出現。

如何將相機的位置納入此算法？

Answer 1

一些假設：

如果相機和子畫面位於同一位置，則子畫面將渲染為0 | 0。

相機向左移動還是精靈向右移動都無關緊要。

由此可以得出結論，只有相對位置很重要，並且可以很容易地計算出（通過減去兩個位置）。

 let x = Math.round(
  (asset.coords.x - player.coords.x) * Math.cos(angle) - (asset.coords.y - player coords.y) * Math.sin(angle)
);
let y = Math.round(
  (asset.coords.y - player.coords.y) * Math.cos(angle) + (asset.coords.x - player.coords.x) * Math.sin(angle)
);