[플러터] 네이버 지도 api 사용하기

1. API 사용 신청

https://www.ncloud.com/product/applicationService/maps

1-1. 이용 신청 

이용 신청 클릭

 

 

• Application 등록 클릭

 

• Mobile Dynamic Map 클릭

 

• 프로젝트에서 android > app > src > build.gradle파일 열기
• namespace의 이름을 복사

 

• 서비스 환경 등록에다가 아까 복사한 것을 붙여넣기하고 추가 버튼 클릭 / 등록 클릭하면 완료

 

 

• 등록이 완료되면 인증 정보에서 Client ID와 Client Secret을 확인 할 수 있다

 

2. Flutter에 api 적용

 

2-1. 패키지 추가

• https://pub.dev/packages/flutter_naver_map

• pubspec.yaml에 패키지를 추가

 

2-2. 화면에 지도 보여주기

• import

import 'package:flutter_naver_map/flutter_naver_map.dart';

• page.dart

  final Completer<NaverMapController> mapControllerCompleter = Completer();
  
  NaverMap(
        options: NaverMapViewOptions(
          indoorEnable: true, // 실내 맵 사용 가능 여부 설정
          locationButtonEnable: true, // 위치 버튼 표시 여부 설정
          consumeSymbolTapEvents: false, // 심볼 탭 이벤트 소비 여부 설정
        ),
        onMapReady: (controller) async {
          mapControllerCompleter.complete(controller);
        },
      ),

• controller.dart

  Future initData() async {
    NaverMapSdk.instance.initialize(
        clientId:"874qgwbl5f",
        onAuthFailed: (error) {
          print('NaverMap Auth failed: $error');
        });
  }