멈멈-토이프로젝트(React)1

지도 api 키워드 검색

순9 2024. 6. 11. 12:50
728x90

하고 싶었던 기능이 사용자가 걸을 때 마다 추가 되는 만보기 기능을 넣고 싶어서 찾아 보았으나

리액트로는 만들 가능성이 낮다고 해서 😥 

사용해 보았던 위도경도로 테스트해 보았는데 숫자가 변경은 됨..걸음수가 추가가 안되서 그렇지

여튼 새롭게 어떤걸 추가 해야 할지 와 디자인 수정이 들어감

 

결론은 지도 검색!

사용자가 가고 싶은 곳을 지도로 검색해서 보여주기

https://react-kakao-maps-sdk.jaeseokim.dev/docs/sample/library/keywordBasic 

위 사이트에서 찾음 키워드 검색 지도

 

난 현재 타입스크립트를 사용 하고 있어서 타입을 지정함

가지고 오자 하는 내용 가져오기

  for (var i = 0; i < data.length; i++) {
          const lat = parseFloat(data[i].y); // string을 number로 변환
          const lng = parseFloat(data[i].x); // string을 number로 변환
          markers.push({
            position: {
              lat: lat, 
              lng: lng, 
            },
            content: data[i].place_name,
            address: data[i].address_name,
          })
         
          bounds.extend(new kakao.maps.LatLng(lat, lng))
        }

1. 문자를 숫자로 변환 해서 데이터를 보냄

2. 이름과 주소의 데이터를 보냄

 

 

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/parseFloat