jiggag / react-native-kakao-maps

@jiggag/react-native-kakao-maps

import { KakakoMapView } from '@jiggag/react-native-kakao-maps';

return (
  <KakaoMapView
    markerImageName="customImageName" // 옵션1
    markerImageUrl="https://github.com/jiggag/react-native-kakao-maps/blob/develop/example/custom_image.png?raw=true" // 옵션2
    markerList={[
        {
          lat: 37.59523,
          lng: 127.08600,
          markerName: 'marker'
        },
        {
          lat: 37.59523,
          lng: 127.08705,
          markerName: 'marker2'
        },
    ]}
    width={300}
    height={500}
    centerPoint={{
        lat: 37.59523,
        lng: 127.08600,
    }}
    onChange={(event) => {
      // event.nativeEvent
    }}
  />
);

시작하기

설치

yarn add @jiggag/react-native-kakao-maps

카카오 앱 키 설정

안드로이드

• ./android/app/src/main/res/values/strings.xml

• <resources>
      ...
      <string name="kakao_app_key">KAKAO_APP_KEY</string>
  </resources>

iOS

• ./Info.plist

• <key>KAKAO_APP_KEY</key>
  <string>KAKAO_APP_KEY</string>

커스텀 마커 이미지 등록

1. 마커 이미지 URL markerImageUrl 옵션으로 설정하여 사용
2. 마커 이미지 등록 후 markerImageName 옵션으로 {이미지} 호출하여 사용

   - 안드로이드: ./android/app/src/main/res/drawable/{이미지}.png
   - iOS: xcode 프로젝트 폴더에 {이미지}.png 추가 + Copy items if needed
   

갑자기 문제가 생겼습니다