유니티 엔진에서 극 좌표계 구현 방법

저작물 참고 필자도 해당 내용을 공부하고 있는 입장으로 주로 오픈 문서, 포럼, AI 질의 응답을 활용하여 관련 내용을 공부하였습니다. 따라서 틀린 내용이 있을 수 있습니다. 다만, 타인(AI 등)의 저작물을 침해하지 않도록 순서, 과정, 스크린샷, 코드 등 다른 저작물을 활용 또는 포함하지 않았으며, AI 등 인터넷 자료는 오로지 기술 원리 이해의 목표로만 활용하고, 본 게시글에 언급된 과정, 흐름, 본문, 게시한 코드는 AI의 복붙 없이 모두 필자가 사전에 알고 있는 그래픽스 기술과 인터넷 상에 공개된 개념을 통해 모두 직접 시도하며 직접 작성하였음을 밝힙니다. 부득이하게 어떤 자료를 인용하는 경우는 링크로 출처를 남기고 인용합니다.

보통 UV 좌표계는 2차원 좌표계이며, 좌측 하단이 (0,0)인 (특정 그래픽 라이브러리는 좌측 상단이 0,0일 수 있다.) 특징을 가지고 있다. 따라서 텍스처를 샘플링하면 네모난 모양으로 샘플링되는 것이 당연하다.

이 때 Polar Coordination 기반으로 X,Y 를 변형시켜주면 중앙이 0이고 바깥이 1인 형태로 UV를 펼칠 수 있게 되는데, 이 특징을 활용함으로써 다양한 원형 효과를 구현할 수 있다.

일단 기본 쉐이더 색상에서 시작한다.

흰색 색상을 diffuse로 내보내는 상태에서, 일단 텍스처 하나를 샘플링 해 본다.

텍스처는 Blender 에서 임의로 내보낸 텍스처 하나를 사용하였다. 당연히 UV 좌표에 따라서 텍스처가 샘플링될 것이다.

여기서 극좌표계의 목표는 중앙을 기준으로 텍스처가 퍼져 나가는 것을 그리는 것이다. 일단 중앙 지점을 선언하기 위해 float2 로 center_UV 변수를 하나 만들어준다.

이제, 각 샘플링 하고자 하는 UV 좌표와 정 중앙 UV 좌표(center_uv)를 연산해야 하는데, 거리 먼저 구해준다.

정 중앙으로부터 각 UV 정점까지의 거리를 distance_from_center에 담아준다.

필자는 텍스쳐 이미지의 UV 좌표 중 높이 부분을 맵핑할 원형 UV의 거리에 적용하고자 한다.

즉 어렵게 계산할 것 없이, 방금 계산한 Distance 거리를 실제 샘플링할 UV 정점 좌표의 y 값으로 대응하면 되는 것이다.

한편, 텍스쳐 이미지의 UV x 좌표는 어느 성분에 매칭해야할까? 바로 각도이다. 오른쪽 원 맵에서는 각 0도부터 360도까지 종이가 펴져있는 상태라고 보면된다. 즉 종이를 절단 했을 때, 밑 변 부분이 각도이자 원본 텍스처 이미지 UV의 x가 되는 것이다.

즉 센터를 원의 중심, 중앙 점으로 했을 때 각도를 구하기 위해서 atan2 함수를 사용하면 된다. atan 은 y/x 성분 사용해서 원래 각도를 구하는 함수이다.

즉 UV 좌표에서 센터를 빼면 방향 벡터가 생기는데, 방향 벡터의 y 성분과 x 성분을 각각 대입해주면 된다. 다만 atan2 함수는 -3.14 +3.14 범위 이기 때문에 3.14로 나누고 +1 후 /2 하면 0~1 범위로 각도가 나온다.

위와 같이 각도에 따라 0~1의 색상이 그려지는 것을 볼 수 있다.

float2 calculatedUV = float2(angle_ratio, distance_from_center);

angle 을 X 좌표로 사용하고, distance를 Y로 사용하여 그리면 아래와 같은 결과가 나오는 것을 볼 수 있다.