# 投影（Projector）機能の使い方

Projector機能は画像を3Dモデルに投影する機能です。

これにより生成した2D画像を3Dモデルに貼り付け3Dモデルの衝突判定や遮蔽を使用しながら2D画像で制作した絵柄を利用することが出来ます

{% embed url="<https://youtu.be/xDh6yVBkNWk>" %}

下記サンプルのシーンとプレハブご参照ください

* サンプルシーン

<mark style="background-color:blue;">Assets/Plugins/Witchpot/Packages/Projection/Examples/Demo/Scenes/3DIsometricCityDemo</mark>

* サンプルのプレハブ

<mark style="background-color:blue;">Assets/Plugins/Witchpot/Packages/Projection/Examples/Demo/Prefab/Projector.prefab</mark>

### 3Dモデルの準備

Unity上でTerrainやAssetStore、ProBuilder、DCCツールなどを使用してステージを準備します

{% embed url="<https://youtu.be/9qFKnrIIgio>" %}

### Depth/Normal to Imageによる画像生成

3Dモデルの形状に合わせた画像を生成、調整します。

細かい制作方法は下記 Text2ImgWithControlNetによる画像生成を御覧ください

[text-to-image-with-controlnet](https://docs.witchpot.com/component/text-to-image-with-controlnet "mention")

<figure><img src="https://501701507-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fxpygm4kgEjp47Cbyg5EY%2Fuploads%2FXKrC0Si67YH186wqcxZU%2Fimage.png?alt=media&#x26;token=9ddbe038-34ca-462a-bfb5-de04d31ac64a" alt=""><figcaption></figcaption></figure>

### Projector機能を使用して3Dモデルに投影を行う

CameraImageProjector.csコンポーネントを使用して画像を3Dモデルに投影します

下記プレハブを参考に設定を行ってください（そのままプレハブの利用が一番簡単です）

<mark style="background-color:blue;">Assets/Plugins/Witchpot/Packages/Projection/Examples/Demo/Prefab/Projector.prefab</mark>

まず初めに投影する対象のオブジェクト（ステージとなる作成した3Dモデルのオブジェクト）に専用マテリアルを設定する必要があります。

MaterialApplyer.cs コンポーネントを使用するとカメラ範囲内のアクティブなオブジェクトに専用マテリアルが設定されます。※手動でマテリアルを設定することも可能です

<figure><img src="https://501701507-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fxpygm4kgEjp47Cbyg5EY%2Fuploads%2FFzeCsrHtjfBMlAUHFfCQ%2Fimage.png?alt=media&#x26;token=0e3bc0f6-c397-4e2d-8460-65986634d69a" alt=""><figcaption></figcaption></figure>

CameraImageProjector.csコンポーネントのパラメータ設定は下記です

マテリアルが適用されていれば自動的に投影されます。

<table><thead><tr><th width="191">パラメータ</th><th>内容</th></tr></thead><tbody><tr><td>Texture Projection</td><td>投影するテクスチャを設定します。<br>投影したい生成した画像（StreamingAssets/StableDiffusion内）を任意のフォルダに移動してTextureTypeをSpriteにして設定してください</td></tr><tr><td>Camera Projection</td><td>画像生成に使用したカメラを設定します（位置・角度など設定が同じであれば別カメラでも使用可能です）</td></tr><tr><td>Projection Type</td><td>基本はGlobalで使用します。もし複数のProjectorを使用したい場合TargetRenderesを設定してください</td></tr></tbody></table>