---
title: Top View Example
slug: world-sdk-guide-kr/top-view-example
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\:QuP_q-PuGs7GYvyosl_VA)]
:::

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)