iPhoneMKMapViewアノテーションクラスタリング
マップに配置するピンがかなりたくさんあるので、それらの注釈をクラスター化するのは良い考えだと思います。 iPhoneでこれを実現する方法がよくわかりません。グーグルマップといくつかのJavaScriptの例で何かを解決することができました。しかし、iPhoneはそのmkmapviewを使用しており、そこで注釈をクラスター化する方法がわかりません。
あなたが知っていて良いアイデアやフレームワークはありますか？ありがとう。
これは非常に一般的な問題であり、解決策が必要だったため、クラスタリングをサポートするMKMapViewのカスタムサブクラスを作成しました。それから私はそれをオープンソースで利用できるようにしました！ここで入手できます： https://github.com/yinkou/OCMapView 。
注釈のクラスタリングを管理し、自分でそれらのビューを処理できます。 OCMapViewフォルダーをプロジェクトにコピーする以外に何もする必要はありません。nibにMKMapViewを作成し、そのクラスをOCMapViewに設定します。 （または、通常のMKMapViewのようなコードで作成して委任します）
IOS 4.2以降、MKMapViewにはクラスタリングを行うために使用できる- (NSSet *)annotationsInMapRect:(MKMapRect)mapRectというメソッドがあるため、必ずしもサードパーティのフレームワークを使用する必要はありません。
WWDC11セッションビデオをチェックしてください ' MapKitを使用して情報を地理的に視覚化する '。それの約半分はそれを行う方法を説明します。しかし、私はあなたのために概念を要約します：
- 2つのマップを使用する（2番目のマップがビュー階層に追加されることはありません）
- 2番目のマップにはすべての注釈が含まれています（繰り返しますが、描画されることはありません）
- マップエリアを正方形のグリッドに分割します
- 使用する
-annotationsInMapRect非表示のマップから注釈データを取得するメソッド - 可視マップは、非可視マップのこのデータから注釈を作成します
幸いなことに、サードパーティのフレームワークはもう必要ありません。 iOS11はネイティブクラスタリングをサポートしています。
実装する必要があります mapView:clusterAnnotationForMemberAnnotations: メソッド。
詳細については、Appleの例： https://developer.Apple.com/sample-code/wwdc/2017/MapKit-Sample.Zip
Appleデモコードを使用すると、コードにクラスタリングの概念を簡単に実装できます。 参照リンク
単純に、クラスタリングに次のコードを使用できます
クラスタリングを実装する手順
ステップ1：重要なことは、クラスタリングに2つのマップビュー（allAnnotationsMapView、）を使用することです。1つは参照用（allAnnotationsMapView）です。
@property (nonatomic, strong) MKMapView *allAnnotationsMapView;
@property (nonatomic, strong) IBOutlet MKMapView *mapView;
viewDidLoadで
_allAnnotationsMapView = [[MKMapView alloc] initWithFrame:CGRectZero];
ステップ2：すべての注釈を_allAnnotationsMapViewに追加します。以下の_photosは注釈配列です。
[_allAnnotationsMapView addAnnotations:_photos];
[self updateVisibleAnnotations];
ステップ3：クラスタリングの以下のメソッドを追加します。このPhotoAnnotationにはカスタムアノテーションがあります。 MapViewDelegateメソッド
- (void)mapView:(MKMapView *)aMapView regionDidChangeAnimated:(BOOL)animated {
[self updateVisibleAnnotations];
}
- (void)mapView:(MKMapView *)aMapView didAddAnnotationViews:(NSArray *)views {
for (MKAnnotationView *annotationView in views) {
if (![annotationView.annotation isKindOfClass:[PhotoAnnotation class]]) {
continue;
}
PhotoAnnotation *annotation = (PhotoAnnotation *)annotationView.annotation;
if (annotation.clusterAnnotation != nil) {
// animate the annotation from it's old container's coordinate, to its actual coordinate
CLLocationCoordinate2D actualCoordinate = annotation.coordinate;
CLLocationCoordinate2D containerCoordinate = annotation.clusterAnnotation.coordinate;
// since it's displayed on the map, it is no longer contained by another annotation,
// (We couldn't reset this in -updateVisibleAnnotations because we needed the reference to it here
// to get the containerCoordinate)
annotation.clusterAnnotation = nil;
annotation.coordinate = containerCoordinate;
[UIView animateWithDuration:0.3 animations:^{
annotation.coordinate = actualCoordinate;
}];
}
}
}
クラスタリング処理方法
- (id<MKAnnotation>)annotationInGrid:(MKMapRect)gridMapRect usingAnnotations:(NSSet *)annotations {
// first, see if one of the annotations we were already showing is in this mapRect
NSSet *visibleAnnotationsInBucket = [self.mapView annotationsInMapRect:gridMapRect];
NSSet *annotationsForGridSet = [annotations objectsPassingTest:^BOOL(id obj, BOOL *stop) {
BOOL returnValue = ([visibleAnnotationsInBucket containsObject:obj]);
if (returnValue)
{
*stop = YES;
}
return returnValue;
}];
if (annotationsForGridSet.count != 0) {
return [annotationsForGridSet anyObject];
}
// otherwise, sort the annotations based on their distance from the center of the grid square,
// then choose the one closest to the center to show
MKMapPoint centerMapPoint = MKMapPointMake(MKMapRectGetMidX(gridMapRect), MKMapRectGetMidY(gridMapRect));
NSArray *sortedAnnotations = [[annotations allObjects] sortedArrayUsingComparator:^(id obj1, id obj2) {
MKMapPoint mapPoint1 = MKMapPointForCoordinate(((id<MKAnnotation>)obj1).coordinate);
MKMapPoint mapPoint2 = MKMapPointForCoordinate(((id<MKAnnotation>)obj2).coordinate);
CLLocationDistance distance1 = MKMetersBetweenMapPoints(mapPoint1, centerMapPoint);
CLLocationDistance distance2 = MKMetersBetweenMapPoints(mapPoint2, centerMapPoint);
if (distance1 < distance2) {
return NSOrderedAscending;
} else if (distance1 > distance2) {
return NSOrderedDescending;
}
return NSOrderedSame;
}];
PhotoAnnotation *photoAnn = sortedAnnotations[0];
NSLog(@"lat long %f %f", photoAnn.coordinate.latitude, photoAnn.coordinate.longitude);
return sortedAnnotations[0];
}
- (void)updateVisibleAnnotations {
// This value to controls the number of off screen annotations are displayed.
// A bigger number means more annotations, less chance of seeing annotation views pop in but decreased performance.
// A smaller number means fewer annotations, more chance of seeing annotation views pop in but better performance.
static float marginFactor = 2.0;
// Adjust this roughly based on the dimensions of your annotations views.
// Bigger numbers more aggressively coalesce annotations (fewer annotations displayed but better performance).
// Numbers too small result in overlapping annotations views and too many annotations on screen.
static float bucketSize = 60.0;
// find all the annotations in the visible area + a wide margin to avoid popping annotation views in and out while panning the map.
MKMapRect visibleMapRect = [self.mapView visibleMapRect];
MKMapRect adjustedVisibleMapRect = MKMapRectInset(visibleMapRect, -marginFactor * visibleMapRect.size.width, -marginFactor * visibleMapRect.size.height);
// determine how wide each bucket will be, as a MKMapRect square
CLLocationCoordinate2D leftCoordinate = [self.mapView convertPoint:CGPointZero toCoordinateFromView:self.view];
CLLocationCoordinate2D rightCoordinate = [self.mapView convertPoint:CGPointMake(bucketSize, 0) toCoordinateFromView:self.view];
double gridSize = MKMapPointForCoordinate(rightCoordinate).x - MKMapPointForCoordinate(leftCoordinate).x;
MKMapRect gridMapRect = MKMapRectMake(0, 0, gridSize, gridSize);
// condense annotations, with a padding of two squares, around the visibleMapRect
double startX = floor(MKMapRectGetMinX(adjustedVisibleMapRect) / gridSize) * gridSize;
double startY = floor(MKMapRectGetMinY(adjustedVisibleMapRect) / gridSize) * gridSize;
double endX = floor(MKMapRectGetMaxX(adjustedVisibleMapRect) / gridSize) * gridSize;
double endY = floor(MKMapRectGetMaxY(adjustedVisibleMapRect) / gridSize) * gridSize;
// for each square in our grid, pick one annotation to show
gridMapRect.Origin.y = startY;
while (MKMapRectGetMinY(gridMapRect) <= endY) {
gridMapRect.Origin.x = startX;
while (MKMapRectGetMinX(gridMapRect) <= endX) {
NSSet *allAnnotationsInBucket = [self.allAnnotationsMapView annotationsInMapRect:gridMapRect];
NSSet *visibleAnnotationsInBucket = [self.mapView annotationsInMapRect:gridMapRect];
// we only care about PhotoAnnotations
NSMutableSet *filteredAnnotationsInBucket = [[allAnnotationsInBucket objectsPassingTest:^BOOL(id obj, BOOL *stop) {
return ([obj isKindOfClass:[PhotoAnnotation class]]);
}] mutableCopy];
if (filteredAnnotationsInBucket.count > 0) {
PhotoAnnotation *annotationForGrid = (PhotoAnnotation *)[self annotationInGrid:gridMapRect usingAnnotations:filteredAnnotationsInBucket];
[filteredAnnotationsInBucket removeObject:annotationForGrid];
// give the annotationForGrid a reference to all the annotations it will represent
annotationForGrid.containedAnnotations = [filteredAnnotationsInBucket allObjects];
[self.mapView addAnnotation:annotationForGrid];
for (PhotoAnnotation *annotation in filteredAnnotationsInBucket) {
// give all the other annotations a reference to the one which is representing them
annotation.clusterAnnotation = annotationForGrid;
annotation.containedAnnotations = nil;
// remove annotations which we've decided to cluster
if ([visibleAnnotationsInBucket containsObject:annotation]) {
CLLocationCoordinate2D actualCoordinate = annotation.coordinate;
[UIView animateWithDuration:0.3 animations:^{
annotation.coordinate = annotation.clusterAnnotation.coordinate;
} completion:^(BOOL finished) {
annotation.coordinate = actualCoordinate;
[self.mapView removeAnnotation:annotation];
}];
}
}
}
gridMapRect.Origin.x += gridSize;
}
gridMapRect.Origin.y += gridSize;
}
}
上記の手順に従うことで、mapviewでクラスタリングを実現できます。サードパーティのコードやフレームワークを使用する必要はありません。 Appleサンプルコード こちらを確認してください。これについて疑問がある場合はお知らせください。
ピンをクラスタリングして、その番号を表示したかっただけです。次のもの https://www.cocoacontrols.com/controls/qtree-objc 私の期待に合っています。
ADClusterMapViewを見たことがありますか？ https://github.com/applidium/ADClusterMapView
それはまさにこれを行います。
私は最近、別の回答で言及されているADClusterMapViewから分岐し、プロジェクトに関連する問題のすべてではないにしても、多くを解決しました。これはkdツリーアルゴリズムであり、クラスタリングをアニメーション化します。
ここからオープンソースで入手できます https://github.com/ashare80/TSClusterMapView
このフレームワーク（XMapView.framework）を試してください。 iOS8をサポートするようになりました。
このフレームワークでは、現在のプロジェクト構造を変更する必要はなく、MKMapViewで直接使用できます。 Zipファイルがあります。一度に200ピンをクラスター化する例を示します。 iPodでテストしたところ、とてもスムーズでした。
http://www.xuliu.info/xMapView.html
このライブラリは以下をサポートします。
- さまざまなカテゴリのクラスタリング
- すべてのカテゴリのクラスタリング
- 独自のクラスター半径の設定など
- 特定のカテゴリを非表示または表示する
- マップ内の各ピンを個別に処理および制御します
Objective-CとSwift here： https://github.com/bigfish24/ABFRealmMapView の両方のためのかなりクールで手入れの行き届いたライブラリがあります
Realm と統合されているため、クラスタリングが非常にうまく行われ、大量のポイントも処理されます。