---
title: トップビュー例
slug: world-sdk-guide-ja/04OtZvKK4D_i-c4wsoqfg
docTags: 
createdAt: 2024-09-02T08:34:13.135Z
---

内蔵のZepetoCameraを無効にし、カスタムカメラを使用することで、異なるカメラの視点を実装できます。



## ステップ 1 : カメラビューの設定

カスタムカメラのトランスフォームを調整して、希望の角度でビューを設定します。

私たちのガイドでは、メインカメラをカスタムカメラとして使用しました。

トップビューについては、以下の設定を参照してください。

![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-7YOXg7vJuzo73XeRE48vH-20240904-102421.png)



## ステップ 2 : スクリプトを書く

シーンに基本的なZEPETOキャラクター作成コードを実装します。

:::hint{type="info"}
**📘 **以下のガイドを参照してください。 \[[ZEPETOキャラクターを作成](docId\:X3HPJvYg3lwW0PU1r8k1s)]
:::

ZEPETOカメラを無効にし、ZEPETOキャラクターを追従するカスタムカメラを作成するスクリプトを作成します。

作成 > ZEPETO > Typescript を選択し、TopViewController に名前を変更します。

スクリプトを TopViewController オブジェクトに追加します。

カスタムカメラがキャラクターを追従するように、以下のコードを書きます。

:::CodeblockTabs
TopViewController

```typescript
import { Camera, Transform, Vector3 } from 'UnityEngine';
import { SpawnInfo, ZepetoPlayers } from 'ZEPETO.Character.Controller';
import { ZepetoScriptBehaviour } from 'ZEPETO.Script';
  
export default class TopViewController extends ZepetoScriptBehaviour {
  
    public customCamera : Camera;
    private localPlayerTr : Transform;
  
    Start() {  
        ZepetoPlayers.instance.OnAddedLocalPlayer.AddListener(() => {
            this.localPlayerTr = ZepetoPlayers.instance.LocalPlayer.zepetoPlayer.character.transform;
            // ZEPETO カメラを無効にします
             ZepetoPlayers.instance.LocalPlayer.zepetoCamera.gameObject.SetActive(false);
        }); 
    }
  
    LateUpdate() {
        if(this.localPlayerTr != null) {
            this.customCamera.transform.position = new Vector3(this.localPlayerTr.position.x, this.customCamera.transform.position.y, this.localPlayerTr.position.z);
        }
    }
}
```
:::

カメラオブジェクトをインスペクターに接続します。

::Image[]{src="https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-yI9s_CAK9WYEQU8EVn4By-20240904-102421.png" size="88" width="357" height="290" position="center" showCaption="false"}



今、画面の中央にある \[▶︎(再生)] ボタンを押して実行してみてください。

既存の ZepetoCamera が無効になり、カスタムカメラが有効になっているのが見えるはずです。

![](https://api.archbee.com/api/optimize/fCt3n1oCa8rgNJ8fw9I2N-e2Nb-Ovrys1gC8TGQhX1i-20240904-102423.gif)