本文主要介紹百度地圖的自定義用法，比如創(chuàng)建地圖、添加標(biāo)注點(diǎn)、添加路徑軌跡等問題不在本文討論范圍，請點(diǎn)擊百度地圖開放平臺。本文屬于本人原創(chuàng)，如需轉(zhuǎn)載，請注明出處。如本文有說明錯(cuò)誤或者不足的地方，還望指出，共同進(jìn)步。

本文主要講解的內(nèi)容有：

1.添加自定義標(biāo)注

2.添加標(biāo)注點(diǎn)氣泡

3.設(shè)定百度地圖適當(dāng)?shù)娘@示范圍

4.點(diǎn)擊標(biāo)注點(diǎn)氣泡彈出并居中顯示

5.軌跡添加紋理圖片

6.添加標(biāo)注點(diǎn)聚合功能

1.添加自定義的標(biāo)注

需求1?

在項(xiàng)目中，需要顯示的標(biāo)注不只有圖片，有時(shí)也會有文字提示，此時(shí)就需要自定義標(biāo)注。尋找解決方法：

第一步：進(jìn)入百度地圖官方API中查找，是否可以添加自定義的view，很遺憾，沒有，只能設(shè)置圖片。

標(biāo)注點(diǎn)添加顯示圖片

第二步：自定義的視圖，通過以下方法轉(zhuǎn)換為image，然后賦值給image。

視圖轉(zhuǎn)為image方法

注意：添加自定義的標(biāo)注點(diǎn)，需要設(shè)置標(biāo)注的中心偏移；不然，在地圖放大縮小時(shí)，標(biāo)注點(diǎn)的定點(diǎn)會跟隨移動。

設(shè)置標(biāo)注點(diǎn)偏移

上面的方法是在百度地圖的回調(diào)方法-(BMKAnnotationView*)mapView:(BMKMapView*)mapView viewForAnnotation:(id)annotation中實(shí)現(xiàn)。

需求2

當(dāng)在地圖上的標(biāo)注點(diǎn)超過2個(gè)時(shí)，如何區(qū)分開。此時(shí)創(chuàng)建自定義的標(biāo)注點(diǎn)繼承于BMKPointAnnotation，在內(nèi)部添加需要的屬性或者方法，然后在百度地圖標(biāo)注視圖回調(diào)方法中實(shí)現(xiàn)相應(yīng)的功能。

繼承BMKPointAnnotation

地圖回調(diào)方法

2.添加標(biāo)注點(diǎn)自定義氣泡

（1）項(xiàng)目中，遇到要點(diǎn)擊標(biāo)注點(diǎn)彈出氣泡視圖，顯示這個(gè)標(biāo)注點(diǎn)的詳細(xì)信息。需要在添加標(biāo)注點(diǎn)時(shí)設(shè)置title的值，自定義氣泡視圖，title值可以隨便賦值。

設(shè)置標(biāo)注點(diǎn)氣泡標(biāo)題

（2）在百度地圖BMKAnnotationView中尋找可以添加氣泡視圖的屬性，找到paopaoView，嗯，命名很別致。

標(biāo)注點(diǎn)氣泡視圖

接下來，自定義需要顯示的氣泡視圖，創(chuàng)建自定義氣泡視圖對象，然后賦值給paopaoView就ok了。

自定義氣泡視圖初始化

氣泡視圖賦值

注意：如果遇到標(biāo)注點(diǎn)是自定義的（比如顯示車輛的圖標(biāo)和車牌號），點(diǎn)擊標(biāo)注點(diǎn)彈出的氣泡顯示位置是以標(biāo)注點(diǎn)x軸的中心對齊，如果需要顯示在其他位置，則需要設(shè)置氣泡的偏移量。

氣泡視圖偏移量

3.設(shè)定百度地圖適當(dāng)?shù)娘@示范圍

下面要講的才是重點(diǎn)，直接上代碼，這里展示的是我自己的思路，如果有不妥或者更好的方法，歡迎指正。

需求是，需要在地圖上添加一組標(biāo)注點(diǎn)，并以合適的縮放比例，將全部的標(biāo)注點(diǎn)全部顯示在地圖可視范圍內(nèi)。通過查找百度地圖的官方API，找到如下方法。

顯示地圖的顯示范圍

百度地圖經(jīng)緯度區(qū)域

百度地圖經(jīng)緯度范圍

實(shí)現(xiàn)思路為：遍歷所有標(biāo)注點(diǎn)的經(jīng)緯度值，找出其中最大和最小的經(jīng)度和緯度值。相當(dāng)于在地圖上畫一個(gè)矩形，需要確定矩形的起始點(diǎn)和寬高，這里是以經(jīng)緯度來計(jì)算。方法如下

計(jì)算出顯示范圍

找出最大最小經(jīng)緯度值

好像上面的方法完美解決，拿衣服！如果遇到如下的需求。需要在地圖上顯示車輛的位置，并顯示車輛的運(yùn)行狀態(tài)和車牌號，由于自定義的標(biāo)注點(diǎn)是以車輛的底部為定點(diǎn)（如下圖車輛顯示定點(diǎn)），右邊的車牌將不會顯示在地圖的可視范圍內(nèi)，這是因?yàn)椋陲@示Region時(shí)，以經(jīng)緯度計(jì)算，剛好在最邊上的標(biāo)注點(diǎn)將會顯示貼邊顯示。

車輛顯示定點(diǎn)

顯示車輛和車牌

如果可以設(shè)置地圖的上下左右的預(yù)留位置，就可以解決這個(gè)問題，接著看官方API，找到可以設(shè)置預(yù)留邊界的方法。如下

顯示地圖范圍

如果使用下面的方法，也可以實(shí)現(xiàn)效果，不過，會出現(xiàn)，設(shè)置了氣泡的顯示范圍（第四個(gè)將會講解），點(diǎn)擊標(biāo)注點(diǎn)顯示氣泡時(shí)，氣泡會產(chǎn)生偏移，這個(gè)偏移值與屏幕尺寸之間的關(guān)系目前還沒有找到。（不推薦使用）

填充地圖顯示范圍

看到需要傳入一個(gè)BMKMapRect，看到注釋，直角地理坐標(biāo)，這是什么鬼？然后無奈去百度，解釋的太專業(yè)，果斷放棄，還有沒其他的方法？

地圖的直角地理坐標(biāo)

在覆蓋物的基類中找到有這個(gè)屬性。思路為添加一段軌跡線，獲取到軌跡線的boundingMapRect，然后賦值。方法為： BMKPolyline*polyline = [BMKPolylinepolylineWithCoordinates:coordscount:count];? 完美解決問題。

覆蓋物基類

4.點(diǎn)擊標(biāo)注點(diǎn)氣泡彈出并居中顯示

最后這個(gè)問題，思路與上一個(gè)類似，具體的實(shí)現(xiàn)方法如下：

點(diǎn)擊標(biāo)注點(diǎn)顯示自定義氣泡時(shí)，氣泡不會居中顯示在地圖上，這就尷尬了！繼續(xù)查找官方API?？吹较旅娴姆椒?，靈光一現(xiàn)，氣泡就是一個(gè)視圖，已知?dú)馀莸膶挾群透叨龋枰蟪鰵馀莸钠瘘c(diǎn)。

將視圖rect轉(zhuǎn)換為地圖regio

經(jīng)緯度轉(zhuǎn)換為視圖坐標(biāo)

設(shè)置地圖的顯示范圍

已知點(diǎn)擊的標(biāo)志點(diǎn)的經(jīng)緯度值，求出這個(gè)點(diǎn)在地圖上的視圖坐標(biāo)點(diǎn)，示意圖如下

已知條件 Map H（地圖視圖的高度）? ?Map W（地圖視圖的寬度）? P（標(biāo)注點(diǎn)的開始位置） bubbleWidth（氣泡的寬度） bubbleHeight（氣泡的高度）

求出? P2（居中顯示的標(biāo)注點(diǎn)）O1（氣泡的開始起點(diǎn)）? O2（氣泡居中顯示的起始點(diǎn)）

第一步：通過百度地圖API求出P的視圖坐標(biāo)

第二步：求出O1起點(diǎn)的坐標(biāo)? O1.x = P.x-bubbleWidth/2;? O1.y = P.x-bubbleHeight;

第三步：通過百度地圖API將氣泡視圖rect轉(zhuǎn)換為BMKCoordinateRegion，然后設(shè)置地圖的顯示范圍。

手繪的示意圖

最后的實(shí)現(xiàn)代碼如下

代碼實(shí)現(xiàn)

5.軌跡添加紋理圖片

公司的項(xiàng)目中，查詢車輛的歷史軌跡時(shí)，需要標(biāo)明車輛的運(yùn)行方向。之前的做法是添加方向標(biāo)注點(diǎn)，但這樣的效果不是很好，用紋理圖片就完美的解決問題。

添加紋理圖片時(shí)，需要注意兩點(diǎn)：一是紋理圖片的方向尖頭必須朝下；二是紋理圖片的尺寸必須為2的n次方冪。

繪制軌跡線的回調(diào)方法

在繪制軌跡線的回調(diào)方法時(shí)，需要自定義BMKPolyLineView，重寫glRender方法，具體實(shí)現(xiàn)如下：

重寫glRender方法

6.添加標(biāo)注點(diǎn)聚合功能

從百度開放平臺上下載示例demo，里面有開源的聚合算法。將其中的文件拷貝到項(xiàng)目中即可。

demo目錄

進(jìn)入MapDemo/ClusterDemoViewController中，核心代碼如下：

更新聚合狀態(tài)

如果覺得可以，給個(gè)贊，謝謝！

下一篇將會講解google地圖的一些用法。