騰訊位置服務地圖SDK是一套提供多種地理位置服務的應用程式介面。通過呼叫該介面，開發者可以在自己的應用中加入地圖相關的功能（如地圖展示、標註、繪製圖形等），輕鬆訪問騰訊地圖服務和資料，構建功能豐富、互動性強、符合各種行業場景的地圖類應用程式。

以下內容轉載自iOS 工程師Genosage的文章《地圖 SDK 系列教程-在地圖上展示指定區域》
作者：Genosage
連結：https://juejin.im/post/5d721a29f265da03970bdc8d
來源：掘金
著作權歸作者所有。商業轉載請聯絡作者獲得授權，非商業轉載請註明出處。

地圖SDK系列教程-在地圖上展示指定區域

在使用騰訊 iOS 地圖 SDK 的過程中，經常會遇到需要地圖展示指定區域的場景，相信大家也會遇到類似的情況，地圖 SDK 提供了許多與之相關的介面，本篇文章將對這些介面進行整合，並提供示例程式碼來實現多個場景下展示指定區域的需求。

需要注意，本篇文章適用於地圖未發生旋轉與俯仰角的場景。

下載騰訊 iOS 地圖 SDK 請前往：iOS 地圖 SDK

指定區域包含單個座標點

在地圖上顯示某個固定的座標點是地圖 SDK 最為基礎的功能之一。

舉例來說，我們根據 SDK 的檢索功能得到了天壇公園的座標 (39.881190,116.410490)，接下來，我們可以通過設定地圖的中心點 centerCoordinate 來讓地圖顯示這個座標，同時我們還可以設定 zoomLevel 來指定縮放級別：

// 設定中心點
self.mapView.centerCoordinate = CLLocationCoordinate2DMake(39.881190,116.410490);    

// 設定縮放級別
self.mapView.zoomLevel = 15;複製程式碼
 

顯示效果如下：

如果想展示墨卡託座標點 QMapPoint 則需要先通過方法 QCoordinateForMapPoint(QMapPoint mapPoint) 將墨卡託座標轉換為經緯度再進行設定。

指定區域包含多個座標點

現在，假如我們想把天壇公園的搜尋結果都顯示在地圖上，應該如何實現呢？

首先，我們通過檢索功能搜尋天壇公園，取搜尋結果的前九個座標點，接下來，應該使我們的地圖視野包含這九個座標點，地圖 SDK 提供了方法 QBoundingCoordinateRegionWithCoordinates(CLLocationCoordinate2D *coordinates,NSUInteger count)

CLLocationCoordinate2D coordinates[9];

// 天壇公園檢索結果座標
coordinates[0] = CLLocationCoordinate2DMake(39.881190,116.410490);
coordinates[1] = CLLocationCoordinate2DMake(39.883247,116.400063);
coordinates[2] = CLLocationCoordinate2DMake(39.883710,116.412900);
coordinates[3] = CLLocationCoordinate2DMake(39.883654,116.412863);
coordinates[4] = CLLocationCoordinate2DMake(39.883320,116.400040);
coordinates[5] = CLLocationCoordinate2DMake(39.876980,116.413190);
coordinates[6] = CLLocationCoordinate2DMake(39.878160,116.413140);
coordinates[7] = CLLocationCoordinate2DMake(39.878980,116.407080);
coordinates[8] = CLLocationCoordinate2DMake(39.878560,116.413160);
    
// 計算區域外接矩形
QCoordinateRegion region = QBoundingCoordinateRegionWithCoordinates(coordinates,9);
    
// 設定區域
self.mapView.region = region;複製程式碼

顯示效果如下：

指定中心點

如果我們想顯示這九個座標點的同時指定某個座標點為地圖中心點，可以使用方法 QBoundingCoordinateRegionWithCoordinatesAndCenter(CLLocationCoordinate2D *coordinates,NSUInteger count,CLLocationCoordinate2D centerCoordinate) 來計算最小外接矩形，以天壇公園為中心點舉例，相關程式碼如下：

// 中心點座標
CLLocationCoordinate2D centerCoordinate = CLLocationCoordinate2DMake(39.881190,116.410490);

// 計算以中心點為中心的區域外接矩形
QCoordinateRegion region = QBoundingCoordinateRegionWithCoordinatesAndCenter(coordinates,9,centerCoordinate);
    
// 設定區域
self.mapView.region = region;複製程式碼

顯示效果如下：

嵌入四周邊界

如果需要在地圖視野四周嵌入一些邊界，可以使用方法 - (void)setRegion:(QCoordinateRegion)region edgePadding:(UIEdgeInsets)insets animated:(BOOL)animated 對地圖的 region 進行設定，程式碼如下：

// 計算區域外接矩形
QCoordinateRegion region = QBoundingCoordinateRegionWithCoordinates(coordinates,9);
    
// 設定區域與邊界
[self.mapView setRegion:region edgePadding:UIEdgeInsetsMake(20,20,20) animated:NO];複製程式碼

顯示效果如下：

墨卡託座標點

如果需要展示多個墨卡託座標點，可以使用地圖 SDK 提供的與上述方法對應的 QBoundingMapRectWithPoints(QMapPoint *points,NSUInteger count) 和 - (void)setVisibleMapRect:(QMapRect)mapRect edgePadding:(UIEdgeInsets)insets animated:(BOOL)animated 等方法。

折線與覆蓋物

當我們想在地圖中展示路線或者覆蓋物時，即地圖 SDK 中的 QPolyline QPolygon 和 QCircle，我們可以直接獲得他們的屬性 boundingMapRect 再進行設定即可。

指定區域包含多個標註

在很多場景下，我們需要在地圖上新增標註點 (Annotation) 並且自定義這些標註的 Image，如下所示：

我們可以通過下面的程式碼來使這些標註剛好顯示在地圖視野內：

// 計算包含 Annotation 與 MapRect 的外接矩形
QMapRect rect = [self.mapView mapRectThatFits:QMapRectNull containsCalloutView:NO annotations:self.annotations edgePadding:UIEdgeInsetsZero];
    
// 設定區域
self.mapView.visibleMapRect = rect;複製程式碼

顯示效果如下：

當標註顯示 Callout View 時，我們可以通過傳入引數 bContainsCalloutView 為 YES 來將 Callout View 包含在地圖視野內，顯示效果如下：

有時我們需要指定區域同時包含當前的螢幕視野以及所有的標註，我們可以通過傳入第一個引數 mapRect 為 self.mapView.visibleMapRect 來達到我們想要的效果。

限制展示指定的區域

當我們需要限制地圖視野，使其只顯示我們指定的區域時，以故宮舉例，可以通過如下的程式碼進行設定：

CLLocationCoordinate2D coordinates[4];

// 故宮範圍矩形的四個頂點的經緯度座標
coordinates[0] = CLLocationCoordinate2DMake(39.922878,116.391547);
coordinates[1] = CLLocationCoordinate2DMake(39.912917,116.392100);
coordinates[2] = CLLocationCoordinate2DMake(39.913312,116.402507);
coordinates[3] = CLLocationCoordinate2DMake(39.923277,116.402024);
    
// 計算區域外接矩形
QCoordinateRegion region = QBoundingCoordinateRegionWithCoordinates(coordinates,4);
    
// 計算平面投影矩形
QMapRect rect = QMapRectForCoordinateRegion(region);
    
// 限制展示區域
[self.mapView setLimitMapRect:rect mode:QMapLimitRectFitWidth];複製程式碼

顯示效果如下：