[C#, REST API, 지도 API] 지역 검색으로 얻어온 위도/경도로 지도 설정하는 Windows Forms 응용 프로그램 만들기

[C#, REST API, 지도 API] 지역 검색으로 얻어온 위도/경도로 지도 설정하는 Windows Forms 응용 프로그램 만들기

---

 

실행화면

여기에서는 카카오 API를 이용할 거예요.

 

키워드로 지역 검색 결과 중에 장소명(palce_name), 경도(x), 위도(y) 값을 이용하여 MyLocale 클래스를 정의하세요.

namespace 지역_검색과_지도_API_메시업

{

    /// <summary>

    /// 지역 클래스

    /// </summary>

    public class MyLocale

    {

        /// <summary>

        /// 지역 명 - 가져오기

        /// </summary>

        public string Name

        {

            get;

            private set;

        }

        /// <summary>

        /// 위도 - 가져오기

        /// </summary>

        public double Lat

        {

            get;

            private set;

        }

        /// <summary>

        /// 경도 - 가져오기

        /// </summary>

        public double Lng

        {

            get;

            private set;

        }

        /// <summary>

        /// 생성자

        /// </summary>

        /// <param name="name">지역 명</param>

        /// <param name="lat">위도</param>

        /// <param name="lng">경도</param>

        public MyLocale(string name, double lat, double lng)

        {

            Name = name;

            Lat = lat;

            Lng = lng;

        }

        /// <summary>

        /// ToString 메서드 재정의

        /// </summary>

        /// <returns>지역 명</returns>

        public override string ToString()

        {

            return Name;

        }

    }

}

 

앞에서 다루었던 카카오 Local API를 이용하여 파서를 제작합니다. JavaScriptSerializer 형식을 사용하기 위해 System.Web.Extentions 어셈블리를 참조 추가해야 하는 것을 잊지 마세요.

using System;

using System.Collections.Generic;

using System.IO;

using System.Net;

using System.Text;

using System.Web.Script.Serialization;

 

namespace 지역_검색과_지도_API_메시업

{

    /// <summary>

    /// 카카오 API 클래스

    /// </summary>

    public class KaKaoAPI

    {

        /// <summary>

        /// 지역 검색 (정적)메서드

        /// </summary>

        /// <param name="qstr">검색어</param>

        /// <returns>검색 결과(지역 컬렉션)</returns>

        public static List<MyLocale> Search(string qstr)

        {

            string site = "https://dapi.kakao.com/v2/local/search/keyword.json";

            string query = string.Format("{0}?query={1}", site, qstr);

 

            WebRequest request = WebRequest.Create(query);

 

            string rkey = "[자신의 카카오 REST API 키] ";

            string header = "KakaoAK " + rkey;           

            request.Headers.Add("Authorization", header);

 

            WebResponse response = request.GetResponse();

            Stream stream = response.GetResponseStream();

            StreamReader reader = new StreamReader(stream, Encoding.UTF8);

            String json = reader.ReadToEnd();

 

            JavaScriptSerializer js = new JavaScriptSerializer();

            dynamic dob = js.Deserialize<dynamic>(json);

            dynamic docs = dob["documents"];

            object[] buf = docs;

            int length = buf.Length;

 

            List<MyLocale> mls = new List<MyLocale>();

            for (int i = 0; i < length; i++)

            {

                string lname = docs[i]["place_name"];

                double x = double.Parse(docs[i]["x"]);

                double y = double.Parse(docs[i]["y"]);

                mls.Add(new MyLocale(lname, y, x));

            }

            return mls;

        }

    }

}

메인 화면에 자식 컨트롤을 배치하세요.

질의를 입력할 텍스트박스(1, tbox_query), 검색 버튼(2, btn_search), 지역 검색 결과를 보여줄 리스트 박스(3, lbox_locale), 지도를 표시할 웹 브라우저 컨트롤(4, web_map)을 배치하세요.

web_map은 앞에서 작성한 지도 API를 이용한 웹 페이지 주소로 설정하세요. 웹 사이트의 가상 디렉토리 명칭이 Demo2이고 웹 페이지가 Start.html이면 다음과 같습니다.

http://localhost/Demo2/Start.html

localhost 대신 IP 주소를 입력하여도 무관합니다.

 

검색 버튼 클릭 이벤트 핸들러를 추가하세요.

 

private void btn_search_Click(object sender, EventArgs e)

{

입력한 검색 질의를 입력 인자로 카카오 API 클래스의 Search 메서드를 호출하여 결과 목록을 얻어옵니다.

    string qstr = tbox_query.Text;

    List<MyLocale> mls = KaKaoAPI.Search(qstr);

 

기존 리스트박스의 항목을 모두 지운 후에 결과 목록의 내용을 리스트 박스 항목에 추가합니다.

    lbox_locale.Items.Clear();

    foreach(MyLocale locale in mls)

    {

        lbox_locale.Items.Add(locale);

    }

}

 

리스트박스의 선택 항목 변경 이벤트 핸들러도 속성 창을 이용하여 추가하세요.

private void lbox_locale_SelectedIndexChanged(object sender, EventArgs e)

{

선택 항목이 없으면 종료합니다.

    if(lbox_locale.SelectedIndex == -1)

    {

        return;

    }

선택 항목을 MyLocale 형식으로 참조합니다.

    MyLocale ml = lbox_locale.SelectedItem as MyLocale;

 

setCenter에 전달할 위도 경도 값으로 object 배열 개체를 생성합니다.

            object[] ps = new object[] { ml.Lat, ml.Lng };

 

웹 브라우저의 현재 문서를 참조합니다.

            HtmlDocument hdoc = wb_map.Document;

 

웹 문서의 자바 스크립트 함수인 setCenter를 호출합니다. 이 때 HtmlDocument 개체의 InvokeScript 메서드를 호출합니다.

            hdoc.InvokeScript("setCenter", ps);

        }