threejs look at（sort of）

Question

私は、私のシーンに、あるオブジェクトから別のオブジェクトを指している矢印のような形の形状を持っています。それはカメラを直接見て追加されます。カメラがx、yに面していると想像してください（例えば、最初の写真を見てください）。ユーザーが "右"（z、x）に回転すると、あなたは終わりを見ているので、何も見えません。しかし、それは無限に薄いので、上から/下を見ると同じことが当てはまります。そして、あなたがそれを傾け始めると、矢印を言うことができません。それは私が避けたいものです。

レンダリング中にlookat（camera.postion）を使用した場合、矢印はもう2つのオブジェクトに対する元の位置にはありません。

これを行うことを想像できる唯一の方法は、カメラの動きに合わせて矢印を1本の軸に沿って回転させることです。イムここ

私は基本的に私は、ユーザーがシーンを回転させると矢印は、矢印のように見えるようにしたいのではなく、それが消えて試してみて、

良く説明するために画像を添付した他のsuggestionsenterの画像記述を探して上から見ても何もない。これらの矢印は、どんな場所/方向にも追加できますので、より巧妙になります。

Answer 1

2つのオプションがあります。完全3Dオプションと偽2dオプション。

A. 3Dオプション

あなたの矢印は、プライマリ軸（尾にその先頭から実行されている）と（その平面形状に垂直な方向）の二次軸を有していると仮定する。必要なことは、カメラの位置とセカンダリ軸の間の角度を計算することです。ここにイメージがあり、あなたが探している角度は黄色の円です。

もの

は、それはあなたの矢印がどのように定義されるかは明らかではないですし、XYZ軸のどれが主であり、 二次ので、ここで提供されていない非常に単純な計算です。

角度を知ったら、その主軸の周りの矢印を角度だけ回転させることができます。これにより、矢印が最も見やすい位置に回転します。

カメラが主軸にある場合、角度は定義されていません。しかし、あなたはこのカメラ位置からの矢のいずれも見ていないでしょう。

B.ザ2Dオプション

これは少し簡単です。 3Dで矢印を描画しないでください。矢の頭と尾の位置を3Dで追跡してください。カメラの位置が変わると、これらの3D位置を2Dキャンバス座標に投影します。これらの2D頭部と尾部の位置の間に2D形状を描くことができます。 2Dシェイプを描画するには、現在のWebGLキャンバスの上に透明な2Dキャンバスを作成する必要があります。

2Dオプションの欠点は、3Dシーンの上に矢印が重ね合わされるため、青い立方体と重なることがあることです。