본문 바로가기
Unity/Unity_API

[Unity] VWorld API를 사용하여 경로 그리기

by Kyoung2 2022. 12. 27.
반응형

지도를 띄어봤으면 지도의 기능들을 하나씩 해보는게 좋을꺼 같아 경로를 표시해 보려고 한다.

Static Map을 통해 만드는 기본적인 맵 기능이므로 화면이 이쁘지는 않지만 필수적인 기능이라면 과금없이 사용할 수 있다는 점에서 좋은 선택일 수 있습니다. 

 

https://tkablog.tistory.com/entry/Unity-VWorld-API%EB%A5%BC-%EC%82%AC%EC%9A%A9%ED%95%98%EC%97%AC-%EC%A7%80%EB%8F%84-%EB%9D%84%EC%9A%B0%EA%B8%B01

 

[Unity] VWorld API를 사용하여 지도 띄우기

시스템을 구현하다 보면 지도를 호출하여 화면에 증강시켜야할 때가 있다. 간단하게 지도를 호출하는 방법과 지도 컨트롤에 대한 내용을 구현해보려고 한다. 앞서 여러가지 지도 호출 API를 사

tkablog.tistory.com

먼저 지도를 띄우는 법 부터 확인 후 추가적으로 경로를 찍을 수 있도록 하겠다.

 

경로를 찍기 위해 Scriptable 을 생성하고 Scriptable에서  자기만의 경로를 만들어 가시화 할 수 있도록 해보겠다.

Scriptable Object란 클래스 인스턴스와는 별도로 대량의 데이터를 저장하는데 사용할 수 있는 데이터 컨테이너다.

 

https://docs.unity3d.com/kr/2019.4/Manual/class-ScriptableObject.html

 

ScriptableObject - Unity 매뉴얼

ScriptableObject는 클래스 인스턴스와는 별도로 대량의 데이터를 저장하는 데 사용할 수 있는 데이터 컨테이너입니다. ScriptableObject의 주요 사용 사례 중 하나는 값의 사본이 생성되는 것을 방지하

docs.unity3d.com

중요한 내용은 유니티 메뉴얼에서 확인할 수 있다. 간단하게 커스텀 에셋을 만든다고 생각하면 될 것 같다.

 

우리에게 필요한 데이터는 인덱스 값과 위·경도 값을 따로 저장하고 있다가 지도가 실행될 때, 데이터를 불러와 그려주는게 좋을 것 같다. 

 

API 폴더를 생성하고 GeoPath.cs 파일을 생성해주었다. 

에디터에서 ScriptableObject를 생성하고 위도 경도 정보를 리스트에 담아 볼것이다.

 

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

[CreateAssetMenu(fileName = "VWorld", menuName = "VWorldPractice/GeoPath", order = 1)]
public class GeoPath : ScriptableObject
{
    [SerializeField]
    public List<Location> geoLocationPath;
}

[System.Serializable]
public struct Location
{
    public double latitude;
    public double longtitude;
}

 

간단하게 Scriptable object 코드를 작성해 보았다. 

프로젝트에 Scriptable Object 폴더를 따로 생성하고 관리해주는게  나중에 관리하기가 편할것이다. 

폴더를 생성해주도록 하자!.

 

Project 창에서 마우스의 오른쪽을 클릭하면 GeoPath.cs 파일에서 설정한 VWorldPractice/GeoPath 항목이 보일것이다.

생성한 폴더 안에서 GeoPath scriptable Object를 만들어주자.

 

Geo Location Path 항목으로 List 뷰가 Inspector 창에 뜰 것이다. 

+ 버튼을 눌러 위도 경도를 추가해주도록하자.

서울의 올림픽 공원의 경로를 한번 찍어보겠다.

구글맵에서 아무 위치나 두번을 클릭하면 위도 경도 좌표가 생성된다.

 

경로를 나타낼 곳을 직접적으로 입력하여 준다. 다른 방법들이 있지만 예제이니 그냥 간단하게 하쟈.

지도를 보여줄 중간 위치를 잡았다. 경로를 보여주기 위해 중간의 위치를 잡고 지도를 호출하여줄것이다.

중간 좌표를 Static Map Loader 에 기입하여 주고 경로를 호출하기 위해 해당 CS파일을 수정하여 줄 것이다.

 

먼저 Route를 어떻게 그리는지에 대한 설명부터 참고하자. 

API 호출은 제대로 이해하감 하면 어렵지 않다.

 

using System.Collections;
using System.Collections.Generic;
using System.Text;
using UnityEngine;
using UnityEngine.Networking;
using UnityEngine.UI;

namespace Cerberus_Platform_API
{
    public class StaticMapLoader : MonoBehaviour
    {

        public RawImage mapRawImage;

        [Header("맵 정보 입력")]
        public string strBaseURL = "http://api.vworld.kr/req/image?service=image&request=getmap&key=";
        public string latitude = "";
        public string longitude = "";
        public int zoomLevel = 14;
        public int mapWidth;
        public int mapHeight;
        public string strAPIKey = "";
        public GeoPath geoPath; // Path Scriptable Object

        private void Start()
        {
            StartCoroutine(VWorldMapLoad());
        }

        IEnumerator VWorldMapLoad()
        {
           // yield return null;

            StringBuilder str = new StringBuilder();
            str.Append(strBaseURL.ToString());
            str.Append(strAPIKey.ToString());
            str.Append("&format=png");
            str.Append("&basemap=GRAPHIC");
            str.Append("&center=");
            str.Append(longitude.ToString());
            str.Append(",");
            str.Append(latitude.ToString());
            str.Append("&crs=epsg:4326");
            str.Append("&zoom=");
            str.Append(zoomLevel.ToString());
            str.Append("&size=");
            str.Append(mapWidth.ToString());
            str.Append(",");
            str.Append(mapHeight.ToString());

            str.Append("&route=style:dashdot|color:rgb(0,120,207)|width:3|point:");  //Setting line Color & width, Design
            for(int i =0; i < geoPath.geoLocationPath.Count; i++)  //loop Path Count
            {
                str.Append(geoPath.geoLocationPath[i].longtitude.ToString("F7"));
                str.Append(" ");
                str.Append(geoPath.geoLocationPath[i].latitude.ToString("F7"));

                if (i == geoPath.geoLocationPath.Count - 1) //Skip end Point 
                {
                    break;
                }
                str.Append(",");
            }


            Debug.Log(str.ToString());

            //Requset API Texture
            UnityWebRequest request = UnityWebRequestTexture.GetTexture(str.ToString());

            yield return request.SendWebRequest();

            if (request.result == UnityWebRequest.Result.ConnectionError || request.result == UnityWebRequest.Result.ProtocolError)
            {
                Debug.Log(request.error);
            }
            else
            {
                mapRawImage.texture = DownloadHandlerTexture.GetContent(request);
            }
        }

    }
}

위와 같이 수정하면 아래와 같은 결과물을 얻을 수 있다.

 

이렇게 VWorld 에서 루트를 찍어보았다. 여러 활용을 할 수 있으니 필요한 사람에게 도움이 되었으면 한다.

 

728x90
반응형

# 로딩 화면 동작 코드(Code) 설정하기
loading