地圖 SDK 系列教程-在地圖上展現指定區域(轉載)

騰訊位置服務地圖SDK是一套提供多種地理位置服務的應用程序接口。經過調用該接口,開發者能夠在本身的應用中加入地圖相關的功能(如地圖展現、標註、繪製圖形等),輕鬆訪問騰訊地圖服務和數據,構建功能豐富、交互性強、符合各類行業場景的地圖類應用程序。


如下內容轉載自 iOS 工程師 Genosage的文章《地圖 SDK 系列教程-在地圖上展現指定區域》
做者: Genosage
連接: http://www.javashuo.com/article/p-nhhhvjpn-ez.html來源:掘金
著做權歸做者全部。商業轉載請聯繫做者得到受權,非商業轉載請註明出處。


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

在使用騰訊 iOS 地圖 SDK 的過程當中,常常會遇到須要地圖展現指定區域的場景,相信你們也會遇到相似的狀況,地圖 SDK 提供了許多與之相關的接口,本篇文章將對這些接口進行整合,並提供示例代碼來實現多個場景下展現指定區域的需求。html

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

下載騰訊 iOS 地圖 SDK 請前往:iOS 地圖 SDKbash

指定區域包含單個座標點

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

舉例來講,咱們根據 SDK 的檢索功能獲得了天壇公園的座標 (39.881190,116.410490),接下來,咱們能夠經過設置地圖的中心點 centerCoordinate 來讓地圖顯示這個座標,同時咱們還能夠設置 zoomLevel 來指定縮放級別:post

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

// 設置縮放級別
self.mapView.zoomLevel = 15;複製代碼

顯示效果以下:ui

若是想展現墨卡託座標點 QMapPoint 則須要先經過方法 QCoordinateForMapPoint(QMapPoint mapPoint) 將墨卡託座標轉換爲經緯度再進行設置。spa

指定區域包含多個座標點

如今,假如咱們想把天壇公園的搜索結果都顯示在地圖上,應該如何實現呢?3d

首先,咱們經過檢索功能搜索天壇公園,取搜索結果的前九個座標點,接下來,應該使咱們的地圖視野包含這九個座標點,地圖 SDK 提供了方法 QBoundingCoordinateRegionWithCoordinates(CLLocationCoordinate2D *coordinates, NSUInteger count) 來計算多個經緯度座標點的最小外接矩形 QCoordinateRegion 在獲得了外接矩形以後,咱們能夠直接設置地圖的 region 來使其顯示咱們想要的區域,完整代碼以下:code

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;複製代碼

顯示效果以下:cdn


指定中心點

若是咱們想顯示這九個座標點的同時指定某個座標點爲地圖中心點,可使用方法 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, 20) animated:NO];複製代碼

顯示效果以下:


墨卡託座標點

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

折線與覆蓋物

當咱們想在地圖中展現路線或者覆蓋物時,即地圖 SDK 中的 QPolyline QPolygonQCircle,咱們能夠直接得到他們的屬性 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 包含在地圖視野內,顯示效果以下:


有時咱們須要指定區域同時包含當前的屏幕視野以及全部的標註,咱們能夠經過傳入第一個參數 mapRectself.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];複製代碼

顯示效果以下:

相關文章
相關標籤/搜索