전체 글 133

카카오 맵API를 이용하여 경로, 텍스트 순서 그리기 및 경로,마커 삭제방법

저번글에서는 API를 이용하여 마커와 텍스트(커스텀오버레이)를 구성하여 카드가 선택목록으로 넘어갈때마다 맵에 추가되는 글을 작성하였었다. 이번 글에서는 경로를 그려주는 방법 및 경로,마커를 삭제하는 방법에 대해서 작성한다 사실 모든 경로와 마커를 지우는것은 그리 어렵지않으나 마커를 하나씩만 지우는 방법에 대해서는 꽤나 고민이 필요하였다. 좋은방법으로 구성한것같지는 않으나 지금 실력으로는 이 방법바께는 생각나지 않음이 아쉬웠다. 앞에 작성한 글과 이어지는 내용이므로 링크를 참조하였다. https://choidoosic.tistory.com/148 카카오 맵 API를 이용하여 마커와 텍스트 그려주기 해당 이미지에는 경로 이외에도 텍스트를 통하여 순서를 표기하여주었는데 순서 표기에 대한 부분은 해당 글에서는 ..

카카오 맵 API를 이용하여 마커와 텍스트 그려주기

해당 이미지에는 경로 이외에도 텍스트를 통하여 순서를 표기하여주었는데 순서 표기에 대한 부분은 해당 글에서는 다음 글에서 다루도록 하겠다. 일단 해당 기능을 구현하기에 앞서서 맛집과 관광지 카드들이 좌표를 들고있어야 해당 기능을 구현할수 있다. 맛집과 관광지에 대한 게시물은 유저가 작성하기 때문에 어떻게해야할까 라는 생각을하였고 게시물을 등록할때에 좌표를 찍어주면 되겠다 라는 생각을하였고 유저의 불편함을 최대한 없에기 위하여 아래의 영상과 같은 방법을 생각하여 구현해두었다. 게시물을 작성하는 게시판에 들어간 모습은 아니지만 위의 영상과 같은 방법으로 유저에게 좌표를 입력받을 생각이다. 카카오 맵API에서 제공해주는 검색기능을 통하여 자신이 원하는 관광지 또는 맛집을 검색후 마커를 클릭하여주면 위도,경도값..

기상청 날씨 api를 이용해 제주도의 실시간 날씨정보 띄워주기

경로를 짤수있는 페이지를 만드는데 제주도의 날씨를 알수있으면 참 좋겠다 싶어서 기상청 날씨api를 이용하여 실시간 날씨정보를 받아왔다. 현재는 1일 분량의 정보를 가져오기만 하였는데 일주일치를 가져와서 띄워주는것은 조금더 생각해봐야겠다. 현재 제주도의 하늘상태에따라 이모티콘이 바뀌고 현재온도와 강수량을 띄워준다. weather-con : 이모티콘의 값, temp : 현재온도, pty : 강수량의 값을 innerHTML을 통해서 넣어준다. 처음 코드를 구성할때에는 ajax 방식을 통해서 데이터를 주고받는것이 아닌 Controller에서 jsp페이지를 호출할때에 기상청 데이터의 값을 모두 들고넘어가는 방식을 사용하였었다. 하지만 이 방식에는 크나큰 문제가 있었다... Controller에서 바로 데이터를 가..

카카오 맵 Api Polygon 을 이용한 구역 나누기 + 모달

※ 깃허브로 팀원들과 코드를 합치기 전이라 코드의 정리와 변수명의 정리가 아직 이루어지지않았다. 글쓰기에 앞서 이번 기능은 카카오 맵 API의 Polygon을 이용하여 구역을 나누고 모달을 띄운후 메인페이지에서 원하는 지역을 클릭시 해당 지역을 모달로 간략하게 소개시켜주고 글 클릭시 해당 구역의 맛집 게시판으로 이동시켜주는 기능을 만들었다. 제주시와 서귀포시 좌표를 처음 받았을때에는 아래 이미지와 같이 세분화되어있었다. 이 부분에대한 좌표를 얻는법과 나눠진 구역을 병합하고 너무 세분화된 꼭지점을 최소화시켜주는 방법은 아래 주소에 포스팅을 따로해두었다. QGIS 프로그램 , MapShaper 사이트, 대한민국 최신 SHP행정구역 파일 등 필요한 사용방법과 주소를 모두 적어두었다. 아래 포스팅 글을볼때에 꼭..

제주도 여행 프로젝트 ERD, 유스케이스

이번 프로젝트의 ERD와 유스케이스다. 마지막 프로젝트이나 기간이 3주밖에 주어지지않아 친구와 둘이서 프로젝트 시작전 테이블을 구성하였고 테이블을 구성하는것이 첫번째 프로젝트때 해보고 하지않았기에 미숙했지만 미숙한 부분을 보안하기 위해 테이블을 맞아서 프로젝트 시작전에 미리 구성하였고 잘 짰다고는 할 수 없으나 중간중간 수정을 하며 사용하였다. ERD를 작성하였던 사이트 입니다. ERDCloud ERDCloud Draw ERD with your team members. All states are shared in real time. And it's FREE. Database modeling tool. www.erdcloud.com 유스케이스는 PPT로 만들어둔것이라 따로 사이트는 없습니다 ㅎㅎ

제주도 여행 프로젝트 5.

6일차에는 사용방법 모달을 띄우는것과 오른쪽 맛집,관광지란에 원하는 정보들을 db에서 가져와 띄우는 작업을 진행하였고 아직 현재 진행형이라고 할 수 있다 날씨 api에 대한 코드와 오류해결을 6일차에도 진행했었기 때문이다. ㅎㅎ 5일차에 날씨 api는 어느정도 마무리를 지었지만 ajax를 사용하는 방식으로 코드를 새로짜야했었고 날씨 api에 대한 공부를 해야할 시간도 어느정도 필요했기 때문이다. 현재 만든 페이지의 모습이다 맛집을 누르면 맛집의 정보를 카드형식으로 쭉 나열해주고 관광지를 누르면 그에 맞는 카드들이 쭉 나올예정인데 이떄에 순서는 좋아요 순으로 나열해줄 예정이다. 현재 해결중인 문제는 데이터베이스에서 값을받아 카드를 만드는것에는 성공하였으나 버튼을 누를때마다 계속 이전의 중복된 값들이 추가되..

제주도 여행 프로젝트 4.(기상 api 사용시 주의할점)

지난 4일차에는 기상 api를 이용하여 날씨의 정보를 가져오는 작업을 하였는데 5일차에는 오류를 만나게되어 그에 대하여 공부하고 수정하는 시간을 가졌다. #주의할점 1(Socket Timeout Exception) 내가 만난 오류는 Socket Timeout Exception이라는 오류이며 Socket Timeout Exception은 소켓을 통해 데이터를 읽거나 소켓을 연결할 때 시간초과가 나면 발생한다고 한다. ConnectTimeout : 서버연결에 지연발생 ReadTimeout : 서버에는 연결 되었으나 데이터를 받는데 지연발생. 기상청 api 또는 서버에 데이터를 요청하여 가져와야하는 상황에서는 ConnectTimeout(), ReadTimeout()을 꼭 설정해두어야 한다. 반복적으로 API ..

날씨 데이터를 가져와 날씨 정보 띄우기 1.

프로젝트중 날씨 api를 사용하게되어 그 사용한 코드에 대한 간략한 정리와 필요한 라이브러리를 정리하여본다. 사진에는 주석이 코드 위에 달려있어 설명이 보기 편하나 주석의 색이 어두워 안보일수 있음으로 밑에 글로도 달아둔다. 글쓴이도 아직 공부를 다 마친것은 아니나 최소한의 정보를 정리해두기 위해서 글을 작성한다. [getStringFromURL()] 메서드는 원하는 데이터값(요청형식, 발표일자 등...)을 지닌 URL값으로 기상청 API를 호출하여 원하는 정보를 JSON 형식으로 값을 받아온다. 1. URL객체를 생성해준다. 매개변수 url에는 경로와 GET식이기에 보내야 할 값들이 들어있다. 2. 받아온 json형식의 데이터를 Buffer을 이용하여 받아준다. #HttpURLConnection 에 대..

제주도 여행 프로젝트 3

해당 이미지의 오른쪽 상단부분의 날씨부분이 현재 ui는 실재 날씨의 값이 아니라 이모티콘이고 이것을 날씨 api를 이용해 날씨값을 받아와 실재 날씨를 띄워주는게 목표였다. 그러나 아쉽게도 오늘 날씨를 이모티콘으로 띄우는것을 달성하지 못했다. JSON 파싱과정 정리. 코드를 작성할때에 HashMap을 이용하여 데이터를 뽑아오는 방법을 읽고 참고하였고 참고한 블로그를 따라했을때에 json안의 데이터를 볼수는 있었으나 json안에 내가 필요한 데이터들을 추출하는 방법은 나와있지않았다. 추가적인 자료를 참고하여 데이터를 추출하려고 하였으나 HashMap으로 받는다면 json의 내용의 쌍따옴표(" ")를 제거하고 (":") 기호를 ("=")으로 변환시키는 일이 발생하여 HashMap을 이용하는 방법으로는 데이터를..

제주도 여행 프로젝트 2

1일차에 목표로하였던 폴리곤은 완성을하였다. 2일차에는 폴리곤에 마우스를 올리면 그 지역의 이름을 띄워주고 클릭시에는 해당 지역에 소개를 모달창으로 띄워준후 상세보기를 누른다면 해당 지역의 관광지 소개 게시판으로 이동하는 작업을 진행하였다. 작업은 크게 2가지로 나눌수있고 첫 번째는 클릭시 모달창을 띄우는것 두 번째는 모달창에 값을 전달하는 것 이였다. 2일차에는 모달창을 이용하여 데이터베이스에서 받아온 값을 띄우는 작업을 완료하였고 이 과정에 있었던 오류를 조금 적어두려고 한다 작업을 진행하던 도중 폴리곤 클릭이 제대로 이루어지지않는 문제가 발생했다 왜 이런 문제가 발생했을까라는 생각을 하게되었고 혹시 코드를 잘못짰나 싶어 Controller에 값을 전달하는 코드들을 주석처리하며 하나씩 테스트를 진행했..

728x90