Flutter - kakaomap webview version 업데이트 후기(0.1.1)

기존에 만들었던 카카오 맵 업데이트를 해봤습니다!

pub dev 링크 : https://pub.dev/packages/kakaomap_webview

포스트 링크 : https://devmemory.tistory.com/64

 

0.2.0 버전이 추가되었습니다

(링크 : https://devmemory.tistory.com/68)

 

먼저 추가된 기능으로는

 

1. MapType추가

  - 교통정보

  - 자동차 전용도로

  - 지형정보

  - 지적편집도

  - 자전거도로

 

2. Marker 드래그 가능한 옵션 추가

 

3. Polygon 기능 추가

< Polygon추가된 모습(?) >

해당 기능들 포함 대부분 기능들 다 사용하기 편리하게(?) 만들어놨으니 편하게 사용하시길..

 

다음으로는 버그수정으로..

custom script부분에 빼먹은 부분이 있어서 직접 작업할 때 안보이던 부분을 수정했습니다..

< 정말 죄송합니다! >

추가적으로 Multi markers를 사용하고 싶으신분들을 위해 sample code를 만들었습니다

    KakaoMapView(
        width: size.width,
        height: 400,
        kakaoMapKey: kakaoMapKey,
        lat: 33.450701,
        lng: 126.570667,
        customScript: '''
    var markers = [];

    function addMarker(position) {

      var marker = new kakao.maps.Marker({position: position});

      marker.setMap(map);

      markers.push(marker);
    }

    for(var i = 0 ; i < 3 ; i++){
      addMarker(new kakao.maps.LatLng(33.450701 + 0.0003 * i, 126.570667 + 0.0003 * i));

      kakao.maps.event.addListener(markers[i], 'click', function(){
        onTapMarker.postMessage('marker ' + i + ' is tapped');
     });
    }

		  var zoomControl = new kakao.maps.ZoomControl();
      map.addControl(zoomControl, kakao.maps.ControlPosition.RIGHT);

      var mapTypeControl = new kakao.maps.MapTypeControl();
      map.addControl(mapTypeControl, kakao.maps.ControlPosition.TOPRIGHT);

              ''',
        onTapMarker: (message) {
          ScaffoldMessenger.of(context)
              .showSnackBar(SnackBar(content: Text(message.message)));
    });

listener부분은 테스트 해봤는데 터치시 i값이 3으로 고정되는 버그가 있는데...

 

이유는 잘 모르겠습니다..

 

간단한 해결방법으로.. for문 대신 여러번 쓰시면 되겠습니다 이렇게 말이죠..

     kakao.maps.event.addListener(markers[0], 'click', function(){
        onTapMarker.postMessage('marker 0 is tapped');
     });
     kakao.maps.event.addListener(markers[1], 'click', function(){
        onTapMarker.postMessage('marker 1 is tapped');
     });
     kakao.maps.event.addListener(markers[2], 'click', function(){
        onTapMarker.postMessage('marker 2 is tapped');
     });

 

 

 

--- 이하 필자의 헛소리 타임이 시작될 예정이니 패키지에 대한 코멘트를 보기위해 오신분들은 스킵하시면 될거 같습니다

 

 

요즘 바빠서 블로그 및 패키지에 신경 쓰기가 조금 힘들었는데

 

바빴었던 부분이 어느정도 마무리 돼서 간만에 업데이트좀 해봤습니다..

 

Dart랑 JS를 번갈아가면서 쓰는것도 귀찮은 일이지만

(위에 예제 코드 만들때 var 대신 int 써서 에러 못찾은 부분이라던가..)

 

안스에서 제공하는 기능들이 하나도 안먹히다보니

 

실수 안하게 신경 정말 많이써야되는 작업인거 같습니다..

 

그리고 버린거 같아 보였던 패키지를 업데이트 하게된 이유는

 

회사에서 사용하는 부분은 구현한 기능들만으로도 충분했지만

 

단톡방에서 "폴리곤 기능 등 이런저런 기능이 없어서 미완성인줄 알았다"

 

개인 메일로 "멀티 마커 사용하고 싶어요!" 등등을 봐서

 

다른분들은 이런 기능이 필요하겠구나 싶어서 업데이트 해봤고..

 

아마 다른기능을 필요로 하시는 분들도 있을거 같다는 생각이 들었습니다

 

만약 정말 필요하신 기능은 업데이트 요청을 해주시거나

 

개인메일 혹은 Issue부분에 물어보시거나 custom script를 사용하셔서 만드셔도 되고

 

github보면 대충 감 잡으셨을테니 직접 만드셔도 될거 같습니다

(그래도 제꺼 사용해주시면 더 좋겠습니...)

 

추가로 몇가지 말씀드리자면 CSS는 작동하는지 안하는지 확인안해봤는데 아마 안될거 같고..

 

주석포함 한글 사용하면 100% script error발생합니다

(혹시 해결방법 있으신분은 공유좀..)

윗부분 됩니다! 0.2.0버전부터 utf-8지원 되게 만들었고 css잘 되는거 확인 했습니다!

 

마지막으로 라이크 눌러주신분들 그리고 사용해주신분들

< 정말 감사합니다! >