Javascript 遠ざかる物体を表現するには

単にscaleを小さくしていくとかではなく、
具体的には例えば橋の上から下を通過する船が遠ざかるのを見ているような感じです。

下記の3つを表現したいのですがうまくいきません。
1 画面上では遠ざかる物体は徐々に上のほうに移動する。
2 画面上では遠ざかる物体は徐々に小さくなっていく。
3 画面上では遠ざかる物体は徐々に角度が浅くなっていく。橋の近くでは船上は見えるが、遠ざかるにつれて徐々に船上は見えなくなる。

下記のような位置関係で計算する場合が多いと思います
カメラスクリーン物体

カメラとスクリーンの距離をa
カメラと物体の距離をb この値をforで徐々に増加させてアニメーションさせます。
カメラと物体の高度差をc

1 は下記のようにしました。translateに指定します。
500 * a / b

2 は下記のようにしました。scaleに指定します
a / b

3 が解りません。いろいろやって見たのですが、例えば橋の上から船を見た場合、自分は下を向いているので画面上では船は立っているように見えると思います。しかし、そのようにすると非常に不自然になってしまいます。rotateX に指定する角度をどのような計算式にすればうまくいくでしょうか？

ikadzuchi

2020/08/08 07:04

図を描いてください。船でたとえられても理解できません。船は立体物ですがあなたは平面を表示しようとしているように見えます。なんとなく、地面に水平な平面図形を地面から高さのある場所から見た図を求めているのかなあという気はしますが。しかしそれにしてもどこを向いているのか分かりません。「画面上では船は立っているように見える」というのは真下を見たならそう見えるのは正しいのに非常に不自然と言います。そもそも真下を向いたら遠ざかる船はすぐに視界から外れるので求めているものと違いそうです。常に物体を向くのかと思いきや物体がtranslateで移動するので違いますし。