飛んでいる矢の角度を進行方向に合わせるには

Question

実現したいこと

• 弓矢を飛ばしたときに、矢のMeshの角度を推進方向に合わせたい

前提

Three.js でゲームを作っています。
オブジェクトを放物線を描いて飛ばせるところまで実現できましたが、矢のような棒状のMeshを飛ばすと、垂直に立った矢が飛んでいきます。

試したこと

飛んでいるオブジェクトのポジション(Vector3)を、毎フレーム保存して、前回の場所と比較して差分を出したり、角度を出したりしているのですが、それが必要な情報なのかと、正しいとして、一緒に飛んでいるMesh（棒状）の角度に反映させる方法・計算がわかりません。

検索して調べてるものの、Unityでは、meshに lookAt という関数があって、差分のベクトルを指定することで実現できる(meshの角度を飛んでる方向に合わせる)と読みましたが、Threeにはそのような関数がありません。

何か考え方のヒントなどありましたら教えていただけたらと思います。
よろしくお願いいたします。

追記：解決しましたので同じ質問んでこられた方へ

飛んでいる矢のvelocityをlookAtに指定すると実現できました。
lookAt関数を持っているのは geometry と Object3d になり、 geometry のlookAtは毎フレーム変更するような使い方ではないと document にありまして、その場合は Object3d(Mesh) の lookAt を使ってくださいとのことでしたのでした。

       arrow.geometry.rotateX(Math.PI / 2) // 矢の形状が垂直だったので横にする

        const normalVel = arrow.velocity.clone().normalize(); // 矢の velocity を正規化
        normalVel.add(arrow.mesh.position); // 正規化した数値に矢の現在地を足す
        arrow.mesh.lookAt(normalVel); // lookAtに指定

あれこれ複雑なことをしてましたが、たったこれだけでした...。
回答していただいた cx20 さん、ありがとうございます。おかげで実現できました。

Answer 1

公式サンプルに mesh の向きを変更するサンプルがありました。こちらが参考にならないでしょうか。
https://threejs.org/examples/#misc_lookat

Comments

[honamin]

教えていただいたサンプルのコードをみて解決できました。ありがとうございます。
Geometoryに lookat 関数が用意されていて、その関数にVector3を渡すことでその座標方向に向けることができました。

https://threejs.org/docs/index.html?q=cyli#api/en/core/BufferGeometry.lookAt

[cx20]

mesh でも lookAt 関数は使えそうな気がします。mesh は OBject3D の派生クラスである為です。
https://threejs.org/docs/?q=mesh#api/en/core/Object3D.lookAt

[honamin]

ありがとうございます！おかげで実現できました。
ありがちなことですが、わかってみると、とてもシンプルなコードでできました。

[cx20]

解決されたようで何よりです。