flutter_naver_map icon indicating copy to clipboard operation
flutter_naver_map copied to clipboard

[New Feature] 클러스터링 기능 추가

Open note11g opened this issue 10 months ago • 3 comments

parent issue: #207

바로 Merge하지 않고, 현재 f7fd068f663fd5e1b267db423b4a1979cdb520c6 까지의 작업을 토대로 인터페이스 검토 후 구현을 진행할 예정이며, PR은 구현 이후 Merge합니다.

사용방법

클러스터블 마커 추가

클러스터링 가능한 마커의 추가. 마커와 동일하게 사용합니다.

final restaurants = await RestaurantAPI.requestBy(region: "Seoul");
final markers = restaurants.map(
    (restaurant) => NClusterableMarker(
      id: restaurant.id,
      position: restaurant.position,
      icon: restaurantIcon,
      caption: NOverlayCaption(text: restaurant.name),
      tags: { // type: Map<String, String>
        "gu": restaurant.addr.gu, // 추후 구/동 별로 클러스터링 병합 전략을 지정할 수 있습니다.
        "dong": restaurant.addr.dong,
      },
  )..setOnTapListener((NClusterableMarker cm) => showRestaurantInfo(cm.info)));

await mapController.addOverlayAll(markers.toSet());

고급 사용법

NaverMap(
  clusterOptions: NaverMapClusterOptions(
    animate: true,
    enableZoomLevel: const NRange(null, 15, includeMax: false), // 15 미만으로 줌 아웃 시 클러스터링
    clusterMarkerBuilder: (info, clusterMarker) {
      final (size, color) = switch (info.size) {
        >= 100 => (56.0, Colors.redAccent),
        >= 35 => (52.0,  Colors.orange),
        _ => (48.0,  Colors.green),
      };
      clusterMarker
        ..setIcon(circleIcon)
        ..setTintColor(color)
        ..setSize(NSize(size, size))
        ..setCaption(info.mergedTag != null ? NOverlayCaption(
            text: info.mergedTag,
            color: Colors.white,
            haloColor:color
            textSize: 14,
            requestWidth: size,
          ) : null)
        ..setSubCaption(NOverlayCaption(
            text: info.size.toString(), 
            color: Colors.white,
            haloColor: Colors.transparent,
         ));
    },
    mergeStrategy: const NClusterMergeStrategy(
      // (4개 미만이면 클러스터링 하지 않음) 클러스터링 대상으로 병합할 최소 마커 수. default: 2
      minClusterChildCount: 4,
      // 클러스터링 대상으로 계산할 최소 화면 거리. default: 70dp
      willMergedScreenDistance: 100,
      // 해당 화면 거리 이상의 태그는 클러스터링 대상으로 계산하지 않습니다. default: ((min(screenW, screenH) * 2 / 3)dp
      maxMergedScreenDistanceByTag: 200,
      // 태그별로 병합이 동작할 줌 레벨을 지정. 화면 거리 기반 병합보다 우선됨. type: Map<String, NRange>
      mergeByEachTagEnableZoomLevel: {
        "gu": NRange(10, 12, includeMax: false), // 구별로 클러스터링
        "dong": NRange(12, 14), // 동별로 클러스터링
      },
    ),
  ),
);

note11g avatar Apr 20 '24 05:04 note11g

구현을 진행합니다.

note11g avatar Apr 23 '24 07:04 note11g

클러스터링 기능의 Preview 버전의 출시일을 안내드립니다. Android Only Preview: 검수 이전 버전 5/6(월), 검수 이후 버전 5/7(화) All Platform(Android+iOS) Support Preview: 5/8(수)

이후 사용자 피드백을 수렴하여 5월 3주차에 정식으로 1.3.0 버전이 출시될 예정입니다.

note11g avatar May 05 '24 18:05 note11g

검수 과정에서 설계상 이슈가 발견되어, 출시가 조금 더 늦어질 것으로 예상됩니다. 정식출시는 미루어지지 않으며, Preview 버전만 이번주 내로 출시되는 것으로 일정이 미루어집니다. 기다려주시는 많은 분들께 죄송하다는 말씀드립니다.

+추가합니다. 본업이 바빠짐에 따라, 이번주까지는 이 프로젝트에 신경쓰기 힘들 것 같습니다. 관련 업데이트 사항은 #235 이슈에서 코멘트로 소식을 남기겠습니다. 감사합니다.

note11g avatar May 07 '24 20:05 note11g

테스트코드는 최종 병합 이전 단계에서 작성하겠습니다.

현재 known issues

  • iOS Memory Leak by multiple addOverlay(clusterableMarker) called. (not with overlayAll(clusterableMarker) called once)
  • ~~Android sometimes not updated screen with frame copy failed~~ fixed at 1cc37eb

note11g avatar Sep 17 '24 06:09 note11g