百度地圖之覆蓋物聚合效果

地圖覆蓋物分為兩種:一種帶聚合效果的铃彰,一種是不帶聚合效果的趴俘。

首先你得有個(gè)KEY,在百度地圖API上注冊(cè)為開發(fā)者后掌眠,你就可以創(chuàng)建一個(gè)應(yīng)用蕾盯,記得選Android類型,因?yàn)槟J(rèn)是服務(wù)器類型蓝丙。
 之后在AndroidManifest上加上下面這些(網(wǎng)絡(luò)级遭、定位權(quán)限的就不需要列出了吧)望拖,最后在APPlication中初始化SDKInitializer.initialize(this);,這樣你的的MapView就可以跑起來啦挫鸽!

一说敏、帶聚合效果的,先來看圖:


Paste_Image.png

實(shí)現(xiàn)的方式很簡(jiǎn)單丢郊。
1盔沫、到百度地圖開放平臺(tái)上進(jìn)行注冊(cè),下載jar包枫匾,導(dǎo)入到項(xiàng)目中去架诞,結(jié)合著開發(fā)文檔和官方Demo。
2干茉、主要涉及到兩個(gè)重要的類MarkerOptions和Marker谴忧。MarkerOptions主要負(fù)責(zé)配置覆蓋物的一些屬性信息。Marker指覆蓋物角虫,MarkerOptions和Marker結(jié)合起來用沾谓,就組成了覆蓋物。
3上遥、MarkerOptions配置

//覆蓋物僅僅是圖標(biāo)
BitmapDescriptor icon = BitmapDescriptorFactory.fromResource(R.drawable.map_personal);
//如果覆蓋物是需要自定義的話搏屑,比如圖標(biāo)和文字是服務(wù)器返回的,就可以定義一個(gè)View布局
  然后BitmapDescriptorFactory.fromView(View view);
MarkerOptions options = new MarkerOptions();
 options.position(newLatLng(sellers.get(i).getLatitude(),sellers.get(i).getLongitude()))        // 位置
                                .title(sellers.get(i).getName())        // title
                                .icon(icon)            // 圖標(biāo)
                                .anchor(0.5f, 0.5f);//設(shè)置 marker 覆蓋物的錨點(diǎn)比例粉楚,默認(rèn)(0.5f, 1.0f)水平居中辣恋,垂直下對(duì)齊
   // 覆蓋物動(dòng)畫
options.animateType(MarkerOptions.MarkerAnimateType.grow);

4、Marker配置

Marker mMarker = (Marker) (baiduMap.addOverlay(options));//初始化Marker模软,并顯示Marker伟骨。
//這里
 Bundle bundle = new Bundle();
 bundle.putSerializable(IntentConstants.SELL_CONTENT_KEY, sellers.get(i));  
mMarker.setExtraInfo(bundle);

5、把以上代碼放到一個(gè)循環(huán)里面燃异,就得到了多個(gè)Marker
6携狭、Marker的點(diǎn)擊事件處理:
BaiduMap.OnMarkerClickListener,通常來說,點(diǎn)擊Marker回俐,需要彈出一個(gè)彈窗信息逛腿,來展示覆蓋代表的信息。
在第四步初始化完Marker之后仅颇,添加一個(gè)bundle单默,然后點(diǎn)擊覆蓋物的時(shí)候使用。

 baiduMap.setOnMarkerClickListener(new   BaiduMap.OnMarkerClickListener() {
            @Override
            public boolean onMarkerClick(final Marker marker) {
                //marker代表點(diǎn)擊的那個(gè)覆蓋物忘瓦,
                //從bundle取出marker的信息
             Bundle bundle2 = marker.getExtraInfo();
             final Seller seller = (Seller) bundle2.getSerializable(IntentConstants.SELL_CONTENT_KEY);
                }
                return true搁廓;
        });

7、點(diǎn)擊出現(xiàn)彈窗信息,彈窗的基本類InfoWindow,初始化的時(shí)候境蜕,彈窗的布局可以隨意進(jìn)行配置可以隨便進(jìn)行配置蝙场。

                    //初始化顯示的位置(1.窗口的內(nèi)容,2位置粱年,3.y軸偏移量)
//                    mInfoWindow = new InfoWindow(markView, marker.getPosition(), -47,listener);
                    mInfoWindow = new InfoWindow(BitmapDescriptorFactory.fromView(markView), marker.getPosition(), -47, listener);
                    //顯示當(dāng)前的infowindow
                    baiduMap.showInfoWindow(mInfoWindow);
                    //點(diǎn)擊inforWindow的事件
                    InfoWindow.OnInfoWindowClickListener listener = new InfoWindow.OnInfoWindowClickListener() {
                        public void onInfoWindowClick() {
//                            1售滤。移動(dòng)到地圖的中心
                            moveMapTo(seller.getLatitude(), seller.getLongitude(), true);
                            //2.底部popWindow彈出//
                            showMapStationInfo(seller);
                        }
                    };

二、有的時(shí)候逼泣,需要打開的地圖的時(shí)候趴泌,覆蓋物直接顯示所有的信息,而且?guī)в芯酆系男Ч鸵玫囊粋€(gè)類ClusterItem嗜憔,先上圖:


Paste_Image.png

聚合后的效果:


Paste_Image.png

1、先從官方Demo中拷貝clusterutil包到項(xiàng)目中氏仗。
Paste_Image.png

2吉捶、實(shí)現(xiàn)聚合效果,兩個(gè)最主要的類ClusterManager和ClusterItem

/**
     *  每個(gè)Marker點(diǎn)皆尔,包含Marker點(diǎn)坐標(biāo)以及圖標(biāo)
     */
    public class MyItem implements ClusterItem {
        private ChargeStation chargeStation;

        public MyItem(ChargeStation chargeStation){
            this.chargeStation = chargeStation;
        }

        @Override
        public LatLng getPosition(){
            return new LatLng(chargeStation.getLatitude(),chargeStation.getLongitude());
        }

        @Override  //隨意定義聚合物的樣式
        public BitmapDescriptor getBitmapDescriptor(){
            View view = mInflater.inflate(R.layout.map_pile_mark_infowindow, null);
            TextView name = (TextView) view.findViewById(R.id.tv_title);
            name.setText(chargeStation.getName());
            return BitmapDescriptorFactory.fromView(view);
        }
    }

3呐舔、初始化點(diǎn)聚合管理類ClusterManager,返回所有聚合點(diǎn)的集合慷蠕,參數(shù)信息應(yīng)該能看懂珊拼。

ClusterManager<MyItem> mClusterManager = new ClusterManager<>(getAbstractActivity(), baiduMap);

4、覆蓋物及覆蓋物的點(diǎn)擊事件

    // 設(shè)置maker點(diǎn)擊時(shí)的響應(yīng)
        baiduMap.setOnMarkerClickListener(mClusterManager);
        mClusterManager.setOnClusterClickListener(new ClusterManager.OnClusterClickListener<MyItem>() {
            @Override
            public boolean onClusterClick(Cluster<MyItem> cluster) {
                Toast.makeText(getAbstractActivity(),
                        "有" + cluster.getSize() + "個(gè)點(diǎn)", Toast.LENGTH_SHORT).show();
                moveMapTo(cluster.getPosition().latitude,cluster.getPosition().longitude,true,ZOOM_LEVE_POINT+1);
                return false;
            }
        });

        mClusterManager.setOnClusterItemClickListener(new ClusterManager.OnClusterItemClickListener<MyItem>() {
            @Override
            public boolean onClusterItemClick(MyItem item) {
                Toast.makeText(getAbstractActivity(),
                        "點(diǎn)擊單個(gè)Item", Toast.LENGTH_SHORT).show();
                //1流炕。移動(dòng)到地圖的中心
//                moveMapTo(item.getLongitude(), chargeStation.getLatitude(), true);
                moveMapTo(item.getPosition().latitude,item.getPosition().longitude,true);
                //2.底部popWindow彈出//
                showMapStationInfo(item.chargeStation);
                return false;
            }
        });

三澎现、擴(kuò)展功能:
1、NonHierarchicalDistanceBasedAlgorithm類里面的
這個(gè)類的主MAX_DISTANCE_AT_ZOOM每辟,代表多遠(yuǎn)的距離可以聚合剑辫。
2、如果要修改聚合的樣式的話渠欺,就要相應(yīng)的修改源碼了妹蔽。
有一篇文章講的特別好,可以參考這里戀貓大神的文章寫得很完整挠将。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末胳岂,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子舔稀,更是在濱河造成了極大的恐慌旦万,老刑警劉巖,帶你破解...
    沈念sama閱讀 210,978評(píng)論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件镶蹋,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)贺归,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,954評(píng)論 2 384
  • 文/潘曉璐 我一進(jìn)店門淆两,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人拂酣,你說我怎么就攤上這事秋冰。” “怎么了婶熬?”我有些...
    開封第一講書人閱讀 156,623評(píng)論 0 345
  • 文/不壞的土叔 我叫張陵剑勾,是天一觀的道長(zhǎng)。 經(jīng)常有香客問我赵颅,道長(zhǎng)虽另,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,324評(píng)論 1 282
  • 正文 為了忘掉前任饺谬,我火速辦了婚禮捂刺,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘募寨。我一直安慰自己族展,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,390評(píng)論 5 384
  • 文/花漫 我一把揭開白布拔鹰。 她就那樣靜靜地躺著仪缸,像睡著了一般。 火紅的嫁衣襯著肌膚如雪列肢。 梳的紋絲不亂的頭發(fā)上恰画,一...
    開封第一講書人閱讀 49,741評(píng)論 1 289
  • 那天,我揣著相機(jī)與錄音例书,去河邊找鬼锣尉。 笑死,一個(gè)胖子當(dāng)著我的面吹牛决采,可吹牛的內(nèi)容都是我干的自沧。 我是一名探鬼主播,決...
    沈念sama閱讀 38,892評(píng)論 3 405
  • 文/蒼蘭香墨 我猛地睜開眼树瞭,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼拇厢!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起晒喷,我...
    開封第一講書人閱讀 37,655評(píng)論 0 266
  • 序言:老撾萬榮一對(duì)情侶失蹤孝偎,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后凉敲,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體衣盾,經(jīng)...
    沈念sama閱讀 44,104評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡寺旺,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,451評(píng)論 2 325
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了势决。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片阻塑。...
    茶點(diǎn)故事閱讀 38,569評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖果复,靈堂內(nèi)的尸體忽然破棺而出陈莽,到底是詐尸還是另有隱情,我是刑警寧澤虽抄,帶...
    沈念sama閱讀 34,254評(píng)論 4 328
  • 正文 年R本政府宣布走搁,位于F島的核電站,受9級(jí)特大地震影響迈窟,放射性物質(zhì)發(fā)生泄漏私植。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,834評(píng)論 3 312
  • 文/蒙蒙 一菠隆、第九天 我趴在偏房一處隱蔽的房頂上張望兵琳。 院中可真熱鬧,春花似錦骇径、人聲如沸躯肌。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,725評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)清女。三九已至,卻和暖如春晰筛,著一層夾襖步出監(jiān)牢的瞬間嫡丙,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,950評(píng)論 1 264
  • 我被黑心中介騙來泰國(guó)打工读第, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留曙博,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 46,260評(píng)論 2 360
  • 正文 我出身青樓怜瞒,卻偏偏與公主長(zhǎng)得像父泳,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子吴汪,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,446評(píng)論 2 348

推薦閱讀更多精彩內(nèi)容