Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: React-kakao-maps-sdk 사용하여 지도 구현 #141

Merged
merged 11 commits into from
Oct 25, 2023
Merged

Conversation

JeonDoGyun
Copy link
Contributor

@JeonDoGyun JeonDoGyun commented Oct 25, 2023

구현된 기능

  • 라이브러리 사용해서 지도 표시
  • 키워드 검색 후 리스트 표시

미구현된 기능

  • Marker가 작동은 하는데, 화면에 표시되지 않아서 해당 오류 해결 중입니다.
  • rebound 해서 지도를 다시 보여주는 부분은 아직 구현되지 않았습니다.

etc

  • npm i 해야됩니다!
  • 그냥 MapMarker만 했을 때는 표시되고, 아래 리스트 가져오는 것과 동일한 조건으로 했는데 왜 MapMarker가 동작하지 않을까요...?

eventhandler에 있는 로직을 함수로 따로 분리하였습니다.
에러 텍스트가 나오는 부분을 컴포넌트로 만들어서 text, textcolor를 받으면 나오도록 분리했습니다.
react-kakao-maps를 통해 script 태그를 쓰지 않고 받아오는 방식으로 변경하였습니다.
이로 인해 index.html에 불필요하게 사용되고 있는 부분 주석처리 했습니다.
영상이 겹쳐보여서 위 아래 간격 주고 비디오 가로, 세로 길이 조정했습니다.
react에서 사용할 수 있는 카카오맵 api 라이브러리를 통해 Map 페이지 수정 중입니다.
화면에 띄우고, 키워드 검색까지 되었지만 window.kakao를 찾지 못하는 문제와 중복 스크립트 사용 문제가 있어 수정중입니다.
mapscript에 동적으로 appkey를 넣어주는 방식을 사용하려고 했으나, 사용 도중 undefined 에러가 계속 발생해서
index.html에 넣어주는 방식으로 다시 바꿨습니다.
script태그로 index.html에서 가져오기 때문에 불필요한 Loader 파일 삭제했습니다.
키워드 검색으로 장소 가져오도록 했습니다.
리스트화를 생각해서 주소, 이름, 좌표를 필터링하여 가져오도록 했습니다.
키워드 검색 결과 리스트 가져오는 것까지 구현했고, MapMarker가 작동은 하는데 표시는 안되어서 이 부분 해결 중입니다.
@LimSumi LimSumi merged commit 73b112e into develop Oct 25, 2023
1 check passed
@LimSumi LimSumi deleted the feat/#119 branch October 25, 2023 15:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants