📍

【Flutter】google_maps_cluster_manager 利用メモ

2022/03/05に公開

Flutterで表示しているGoogleMapの、クラスタリング(近いマーカーをまとめる)対応にて、
ライブラリ「google_maps_cluster_manager」を使用してみたのでメモ
基本的な内容は公式に書いてあるため、補足がメインとなります。

google_maps_cluster_manager 概要

マーカーをまとめる計算は、ジオハッシュを用いる
[参考]　位置情報データの扱い方（ジオハッシュとか）
https://qiita.com/yabooun/items/da59e47d61ddff141f0c
基本的には、マップの表示範囲内にあるマーカーに対してクラスタリング
マップ表示範囲外も設定でクラスタリング対象とすることは可（表示領域の1倍〜2倍まで）
デフォルトでは、マップの表示範囲の1.5倍の範囲でクラスタリング

main.dart

// オプション設定例
  ClusterManager _initClusterManager() {
    return ClusterManager<Place>(
    items, _updateMarkers,
        markerBuilder: _markerBuilder,　// マーカー生成処理
        levels: [1, 4.25, 6.75, 8.25, 11.5, 14.5, 16.0, 16.5, 20.0],
        extraPercent: 0.2, // 追加のクラスタリング範囲(0.2の場合、マップ表示範囲の1.2倍)
        stopClusteringZoom: 17.0 // ズームレベルが17以上であればクラスタリングしない
	);
  }

levelsについて

Configure this if you want to change zoom levels at which the clustering precision change
(訳)クラスタリング精度を変更するズームレベルを変更する場合に設定します。

クラスタリング精度は、ジオハッシュの桁数によって変わり、
桁数と範囲の関係は以下の表となります。

桁数	南北の距離	東西の距離
1	4989600.00m	4050000.00m
2	623700.00m	1012500.00m
3	155925.00m	126562.50m
4	19490.62m	31640.62m
5	4872.66m	3955.08m
6	609.08m	988.77m
7	152.27m	123.60m
8	19.03m	30.90m
9	4.76m	3.86m
10	0.59m	0.97m

ジオハッシュの桁数とlevelsの関係は、要素の数・順番で決まる仕様となっており、
オプション設定例に記載した内容であれば、
levels[0](ズームレベル:1)は、ジオハッシュ1桁
levels[5](ズームレベル:14.5)は、ジオハッシュ6桁
となります。

現在のズームレベルが、levelsに指定した値に切り替わるタイミングで、
ジオハッシュの桁数が変更(クラスタリング範囲の拡大縮小)となります。

google_maps_cluster_manager 概要

levelsについて

Discussion