Event for Diverse Game Engineers #4のLTで使用した資料です。 極座標を使って、ビューアを作成する内容です。

1. 発表者:akoto
発表日 2019/03/23
UnityでAddComponentするだけで
3DViwerを作れた話

2. 自己紹介
1
名前 : akoto
Twitter : @_akoto_
仕事 : スマートフォンアプリの開発・運営
趣味 : XR、ゲーム作り、ガンプラ
猫好き : とある猫好きな有名登壇者をリスペクして資料にも
猫が登場します。
ツイートは、プラモデルの話も多いですが、ゲーム業界の記
事やセミナーや勉強会の事も頻繁にツイートしています。

3. アジェンダ
2
 概要
 デモ
 3DViewerでやっている事の紹介
 コード全文/カメラの位置を計算しているところ
 どんな事をしているのか(拡大・縮小/回転/平行
移動)
 まとめ
 おまけ

4. 概要
3
 近年、スマホ向けの3Dゲームがリリースされるよ
うになって来た中で、Viwer機能が必要とされる
機会も多いと思います。今回はUnity向けの
3DViwerを、簡単な数学を使って実現してみたと
いう話です。
 ターゲットとしては、Unityは扱えるが、サイエ
ンスプログラムは苦手や覚えたいという方

5. デモ
4
簡単なデモを見せます

6. 3DViewerでやっている事の紹介
5
 ピンチイン/ピンチアウトで対象物の距離を変え
る(拡大・縮小)
 フリックで、カメラを対象物を中心に回転させる
（回転）
 スワイプで、カメラの位置を変える(平行移動)

7. コード全文
6
全て入れると、小さくなってしまうので、Qita記事
のリンク先を参照してください。
※ 後ほど、この資料はUPします。
https://qiita.com/_akoto_/items/19366d705186417384
07#コード

8. カメラの位置を計算しているところ
7

9. どんな事をしているのか
8
 式で表すと極座標に平行移動を足したものを使用
x = r * sin(θ) * sin(φ) + A.x
y = r * cos (θ) + A.y
x = r * sin(θ) * cos(φ) + A.z
r :対象物を中心とした球の半径
Θ :縦の移動量
φ:横の移動量
A :平行移動の移動量

10. 拡大・縮小
9
 r成分を変化させている
 球の半径を変える事で、カメラと対象物の距離も
変化

11. 回転
10
 sin、cosを使用している箇所で変化させている
 Θやφは、指やマウスがスクリーンを横断する移
動量を、 Θやφに当てはめている。
 また、縦の回転は、縦移動しか影響を与えない

12. 平行移動 その1
11
 A成分でカメラを移動させている
 極座標では、拡大と回転しか対応できない為、移
動成分を最後にpositionに加える必要がある
 注意、しなければいけないのは、カメラの
positionにだけ移動成分を足すと、視点が変わら
ない為、LookAtも同じ成分を加える必要がある

13. 平行移動 その2
12
 カメラは回転している為、平行移動する向きも常
に変化している。Unityカメラのtransformには、
正規化済でカメラにとって垂直なのupベクトルと
rightベクトルが入っている為、これを使う。

14. まとめ
13
 3DViewerのUIは、極座標を用いて実現する事がで
きる
 RayもColliderも使用しない為、お手軽にできる

15. おまけ
14
Qita記事では実現していませんが、リリースするに
あたってやっておいた方が良いこと
 勢いよくフリックした後、徐々に止まるというよ
うなバネを入れる
 対象物の大きさやポージングによって、中心から
最も離れた頂点を基準に、拡大値の最小値をス
ケールさせる必要がある。例えば、長い槍を持っ
ているキャラの場合は、槍の先端部分がカメラに
減り込まないように調整する。簡単にやるなら、
対象物をスケールさせる事が最も簡単。