2. 程式人生 > >百度地圖：加強篇（覆蓋物的實現）

百度地圖：加強篇（覆蓋物的實現）

阿新 • • 發佈：2019-02-03

覆蓋物
如標註、向量圖形元素(包括：折線和多邊形和圓)、定點陣圖標等。覆蓋物擁有自己的地理座標，當您拖動或縮放地圖時，它們會相應的處理。
覆蓋物包括：

  1. 覆蓋物的抽象基類：Overlay（核心類）
  2. 文字繪製覆蓋物：TextOverlay
  3. 分條目覆蓋物：ItemizedOverlay
  4. 路線規劃覆蓋物：RouteOverlay
  5. 換乘路線覆蓋物：TransitOverlay

  6. 我的位置覆蓋物：MyLocationOverlay

    1、實現目的：在底圖上畫一個圓形的幾何圖形（覆蓋物）
    實現過程：1、建一個基類實現基本的底圖效果，再建一個類實現覆蓋物，當前類繼承基類；2、然後通過
    //①獲取mapView存放覆蓋物的集合
    List overlays = mapView.getOverlays();
    // ②建立自己的overlays資訊並新增集合中
    GraphicsOverlay overlay = new GraphicsOverlay(mapView);
    // 設定幾何圖形
    setData(overlay);
    overlays.add(overlay);
    // ③重新整理mapView的顯示內容
    mapView.refresh();
    3、設定幾何圖形：通過新建一個圖形Graphic(geometry, symbol)，裝幾何元素+樣式引數，然後將該圖形新增到圖形的overlay裡面。overlay.setData(graphic);再設定幾何元素和樣式引數。
    4、再設定Manifest.xml的內容即可。
    實現效果：
    這裡寫圖片描述


    GraphicsOverlayDemo.java

package huaxa.it.map;

import java.util.List;

import com.baidu.mapapi.map.Geometry;
import com.baidu.mapapi.map.Graphic;
import com.baidu.mapapi.map.GraphicsOverlay;
import com.baidu.mapapi.map.Overlay;
import com.baidu.mapapi.map.Symbol;

import android.R.color;
import
 
 android.R.drawable;
import android.os.Bundle;

/**
 * @專案名： BaiduMap
 * @包名： huaxa.it.map
 * @類名： GraphicsOverlayDemo
 * @建立者： 黃夏蓮
 * @建立時間： 2016年12月1日 ,下午6:13:46
 * 
 * @描述： TODO
 */
public class GraphicsOverlayDemo extends BaseActivity
{
    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        // TODO Auto-generated method stub
 

        super.onCreate(savedInstanceState);
        draw();
    }

    /**
     * 繪製幾何圖形
     */
    private void draw()
    {
        // 覆蓋物操作
        // ①獲取存放覆蓋物的集合(MapView)
        List<Overlay> overlays = mapView.getOverlays();
        // ②建立自己的overlays資訊新增集合中
        GraphicsOverlay overlay = new GraphicsOverlay(mapView);
        // 關於幾何圖形設定
        setData(overlay);
        overlays.add(overlay);
        // ③重新整理mapView的顯示內容
        mapView.refresh();

    }

    /**
     * 幾何圖形設定
     * 
     * @param overlay
     */
    private void setData(GraphicsOverlay overlay)
    {

        // 繪製圓
        /**
         * setCircle(GeoPoint geoPoint, int radius) 設定圖形為圓 引數： geoPoint地理座標
         * radius圓的半徑，單位：米
         */
        // 幾何元素的定義
        // 圓心+半徑
        Geometry geometry = new Geometry();
        geometry.setCircle(geoPoint, 1000);
        // 樣式
        // 顏色+是否填充+如果不填充，繪製圓的線條的粗細
        Symbol symbol = new Symbol();
        /**
         * setSurface
         * 
         * public void setSurface(Symbol.Color color, int status, int linewidth)
         * 設定面樣式 引數： color - 顏色 status - 填充狀態，0表示不填充，1表示填充 linewidth -
         * 線寬,當填充狀態為填充時線寬無意義
         */
        Symbol.Color color = symbol.new Color();
        //指定三色
        color.red = 255;
        color.green = 0;
        color.blue = 0;
        color.alpha = 100;
        symbol.setSurface(color, 1, 0);
        Graphic graphic = new Graphic(geometry, symbol);
        overlay.setData(graphic);

    }

}

再設定Manifest.xml的內容即可。

2、實現目的：在底圖上畫一個文字圖形（覆蓋物）
使用到TextOverlay類，其中用到TextItem對文字進行設定。
實現效果：
這裡寫圖片描述
TextOverlayDemo.java

package huaxa.it.map;

import java.util.List;

import com.baidu.mapapi.map.Overlay;
import com.baidu.mapapi.map.Symbol;
import com.baidu.mapapi.map.TextItem;
import com.baidu.mapapi.map.TextOverlay;



import android.graphics.Typeface;
import android.os.Bundle;

/**
 * @專案名： BaiduMap
 * @包名： huaxa.it.map
 * @類名： TextOverlayDemo
 * @建立者： 黃夏蓮
 * @建立時間： 2016年12月1日 ,下午6:13:46
 * 
 * @描述： TODO
 */
public class TextOverlayDemo extends BaseActivity
{
    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        draw();
    }

    /**
     * 繪製文字圖形
     */
    private void draw()
    {
        // 覆蓋物操作
        // ①獲取存放覆蓋物的集合(MapView)
        List<Overlay> overlays = mapView.getOverlays();
        // ②建立自己的overlays資訊新增集合中
        TextOverlay overlay = new TextOverlay(mapView);
        // 關於文字圖形設定
        setData(overlay);
        overlays.add(overlay);
        // ③重新整理mapView的顯示內容
        mapView.refresh();

    }

    /**
     * 文字條目設定
     * 
     * @param overlay
     */
    private void setData(TextOverlay overlay)
    {

        TextItem Item = new TextItem();
        //設定文字格式
        // int align
        // 文字對齊方式 ，為 ALIGN_TOP,ALIGN_CENTER, ALIGN_BOTTOM中的一個值
        // static int ALIGN_BOTTOM
        // 文字對齊引數，下邊中點對齊
        // static int ALIGN_CENTER
        // 文字對齊引數，中心對齊
        // static int ALIGN_TOP
        // 文字對齊引數，上邊中點對齊
        // Symbol.Color bgColor
        // 文字背景色, 預設為透明
        // Symbol.Color fontColor
        // 文字顏色
        // int fontSize
        // 字號大小
        // GeoPoint pt
        // 文字顯示的位置，用經緯度座標表示
        // String text
        // 要顯示的文字內容
        // Typeface typeface
        // 文字字型， android 字體表示，為空則用系統預設字型.
        Item.align = TextItem.ALIGN_TOP; 
        Item.fontColor = getColor();
        Item.fontSize = 20;
        Item.pt = geoPoint;
        Item.text = "廣東工業大學";
        Item.typeface = Typeface.SERIF;
        overlay.addText(Item);

    }

    private Symbol.Color getColor(){
        Symbol symbol = new Symbol();
        Symbol.Color color= symbol.new Color();
        color.alpha=100;
        color.blue=255;
        color.red=0;
        color.green=0;
        return color;

    }

}

3、實現目的：在底圖上畫一個多條目（覆蓋物，如圖示）
實現過程：使用到ItemizedOverlay類
ItemizedOverlay(
getResources().getDrawable(R.drawable.eat_icon), mapView);//第一個引數就是圖片，第二個引數是mapView。
接著對OverlayItem進行設定，然後新增到itemizedOverlay裡面就可以了。另外，可以設定多個條目，直接設定具體座標，並新增到itemizedOverlay裡面。
實現效果
這裡寫圖片描述
ItemizedOverlayDemo.java

package huaxa.it.map;

import java.util.List;

import android.os.Bundle;

import com.baidu.mapapi.map.ItemizedOverlay;
import com.baidu.mapapi.map.Overlay;
import com.baidu.mapapi.map.OverlayItem; 
import com.baidu.platform.comapi.basestruct.GeoPoint;

/**
 * @專案名： BaiduMap
 * @包名： huaxa.it.map
 * @類名： ItemizedOverlayDemo
 * @建立者： 黃夏蓮
 * @建立時間： 2016年12月2日 ,上午9:14:17
 * 
 * @描述： 多條目覆蓋物
 */
public class ItemizedOverlayDemo extends BaseActivity
{
    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        controller.setZoom(16);
        draw();
    }

    /**
     * 繪製文字圖形
     */
    private void draw()
    {
        // 覆蓋物操作
        // ①獲取存放覆蓋物的集合(MapView)
        List<Overlay> overlays = mapView.getOverlays();
        // ②建立自己的overlays資訊新增集合中
        ItemizedOverlay<OverlayItem> overlay = new ItemizedOverlay<OverlayItem>(
                getResources().getDrawable(R.drawable.eat_icon), mapView);
        setData(overlay);
        overlays.add(overlay);
        // ③重新整理mapView
        mapView.refresh();

    }

    // 設定多條目資料
    private void setData(ItemizedOverlay<OverlayItem> overlay)
    {
        // OverlayItem(GeoPoint point, String title, String snippet)
        // protected GeoPoint mPoint
        // 該item的位置
        // protected String mTitle
        // 該item的標題文字
        // protected String mSnippet
        // 該item的文字片段
        String mSnippet = "該學校是由……";
        OverlayItem Item = new OverlayItem(geoPoint, "廣東工業大學", mSnippet);
        overlay.addItem(Item);

        Item = new OverlayItem(new GeoPoint(latitude, longitude+1000), "向東", "增加經度");
        overlay.addItem(Item);

        Item = new OverlayItem(new GeoPoint(latitude, longitude-1000), "向西", "減少經度");
        overlay.addItem(Item);

        Item = new OverlayItem(new GeoPoint(latitude+1000, longitude-1000), "向西北", "增加緯度，減少經度");
        overlay.addItem(Item);
    }
}

4、實現目的：對上面的多條目進行泡泡顯示
實現過程：1、實現佈局pop.xml；2、實現popView的初始化操作，設定popView不可見，並把popView新增到mapView裡面。3、通過onTap()方法實現點選事件，需要更新mapView（當點選一個Item時，會彈出一個pop視窗），通過mapView.updateViewLayout(popView, params);更新View，而params裡面需要設定pop視窗的位置，所以需要先重新定義params；再設定pop視窗可見，進而設定pop視窗的顯示內容。注意：如果沒有將popView中的TextView在此處例項化，會報空指標異常。
實現效果：
這裡寫圖片描述
pop.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
        android:id="@+id/user_info"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="20dip"
        android:layout_weight="1"
        android:background="@drawable/popupmap"
        android:gravity="center_vertical"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/round"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="2dip"
            android:src="@drawable/round" />

        <TextView
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:ellipsize="end"
            android:text="標題"
            android:textSize="20sp" />

        <ImageView
            android:id="@+id/roads"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/roads" />

</LinearLayout>

這裡寫圖片描述
修改java檔案為：

package huaxa.it.map;

import java.util.List;

import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup.LayoutParams;
import android.widget.TextView;

import com.baidu.mapapi.map.ItemizedOverlay;
import com.baidu.mapapi.map.MapView;
import com.baidu.mapapi.map.Overlay;
import com.baidu.mapapi.map.OverlayItem;
import com.baidu.platform.comapi.basestruct.GeoPoint;

/**
 * @專案名： BaiduMap
 * @包名： huaxa.it.map
 * @類名： ItemizedOverlayDemo
 * @建立者： 黃夏蓮
 * @建立時間： 2016年12月2日 ,上午9:14:17
 * 
 * @描述： 多條目覆蓋物
 */
public class ItemizedOverlayDemo extends BaseActivity
{
    private TextView    title;
    private View        popView;
    private OverlayItem Item;

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        controller.setZoom(17);

        initPop();
        draw();
    }

    // 新增泡泡
    // 點選某個具體的item的時候在其上方顯示

    // 載入pop
    // 新增到mapview中，不用設定座標，pop隱藏
    // 當點選時，顯示泡泡，位置更新

    private void initPop()
    {
        // 初始化popView並且設定相應引數
        popView = View.inflate(getApplicationContext(), R.layout.pop, null);    
        MapView.LayoutParams params = new MapView.LayoutParams(
                MapView.LayoutParams.WRAP_CONTENT,
                MapView.LayoutParams.WRAP_CONTENT, null,
                MapView.LayoutParams.BOTTOM_CENTER);
        mapView.addView(popView, params);
        popView.setVisibility(View.INVISIBLE);// 不可見

    }

    /**
     * 繪製文字圖形
     */
    private void draw()
    {
        // 覆蓋物操作
        // ①獲取存放覆蓋物的集合(MapView)
        List<Overlay> overlays = mapView.getOverlays();
        // ②建立自己的overlays資訊新增集合中
        ItemizedOverlay<OverlayItem> overlay = new ItemizedOverlay<OverlayItem>(
                getResources().getDrawable(R.drawable.eat_icon), mapView)
        {
            @Override
            protected boolean onTap(int index)
            {
                OverlayItem item = getItem(index);

                // 更新pop
                MapView.LayoutParams params = new MapView.LayoutParams(
                        MapView.LayoutParams.WRAP_CONTENT,
                        MapView.LayoutParams.WRAP_CONTENT, item.getPoint(),
                        MapView.LayoutParams.BOTTOM_CENTER);

                mapView.updateViewLayout(popView, params);

                popView.setVisibility(View.VISIBLE);
                //務必在這裡例項化TextView空間，否則會報空指標異常。
                title = (TextView) findViewById(R.id.title);
                    title.setText(item.getTitle());
                return super.onTap(index);
            }
        };

        setData(overlay);
        overlays.add(overlay);
        // ③重新整理mapView
        mapView.refresh();

    }

    // 設定多條目資料
    private void setData(ItemizedOverlay<OverlayItem> overlay)
    {
        // OverlayItem(GeoPoint point, String title, String snippet)
        // protected GeoPoint mPoint
        // 該item的位置
        // protected String mTitle
        // 該item的標題文字
        // protected String mSnippet
        // 該item的文字片段
        String mSnippet = "該學校是由……";
        Item = new OverlayItem(geoPoint, "廣東工業大學", mSnippet);
        overlay.addItem(Item);

        Item = new OverlayItem(new GeoPoint(latitude, longitude + 1000), "向東",
                "增加經度");
        overlay.addItem(Item);

        Item = new OverlayItem(new GeoPoint(latitude, longitude - 1000), "向西",
                "減少經度");
        overlay.addItem(Item);

        Item = new OverlayItem(new GeoPoint(latitude + 1000, longitude - 1000),
                "向西北", "增加緯度，減少經度");
        overlay.addItem(Item);
    }
}

相關推薦

百度地圖：加強篇（覆蓋物的實現）

覆蓋物 如標註、向量圖形元素(包括：折線和多邊形和圓)、定點陣圖標等。覆蓋物擁有自己的地理座標，當您拖動或縮放地圖時，它們會相應的處理。 覆蓋物包括： 覆蓋物的抽象基類：Overlay（核心類） 文字繪製覆蓋物：TextOverlay 分條目覆蓋物：I

百度地圖：加強篇（範圍+點檢索）

核心類： MKSearch和MKSearchListener MKSearch用於位置檢索、周邊檢索、範圍檢索、公交檢索、駕乘檢索、步行檢索 int busLineSearch(String city, String busLineUid)

百度地圖api入門介紹（js篇）

顯示 .com cnblogs androi web 入門介紹 步驟 api 地圖api 最近因為用到了百度地圖的api,感覺還有點用記錄一下，一方面充實一下自己，第二也希望有用到的同學可以參考一下；因為之前用過android baidu api 所以再用web

百度地圖3.2教程（2）公交查詢

track error alt 3.1 內容 說了 ase 放大 gets 上一篇地址 百度地圖3.1教程—檢索功能演示 還記得兩天前 我在找公交接口，非常不幸。接口有些查不到，幾年的前的數據，哎 。算了唄，突然想起來了百度地圖有這個功能，結果去看了API，尼瑪這

百度地圖自定義座標標識覆蓋物，隨地圖縮放偏移解決辦法

百度地圖在新增自定義標註的時候可能會遇見座標標識，隨著地圖縮放位置產生偏移，我折騰了一個上午，記下這篇。  在此之前，請參考文章： http://www.cnblogs.com/jz1108/archive/2011/09/15/2152122.html  但是注意：

基於百度地圖API刪除指定的覆蓋物

引用百度地圖API過程中，想刪除指定的覆蓋物，有很多很多的坑。什麼clearOverlay()方法，直接給我所有覆蓋物都給乾沒了。還有網上介紹的removeOverlay(物件)，這種又介紹不清楚，然後自己經過實踐，最終解決了。 直接上圖、上程式碼。 查詢所有地圖的覆蓋物程式碼： /

C#呼叫百度地圖API經驗分享（三）

    這一篇我將跟大家分享一下我自己在開發過程中總結出的一些操作地圖的方法，屬性，及思路，希望可以讓大家少走彎路。 1.定位 一般百度的示例DEMO裡開始初始化地圖時用的都是map.centerAn

百度地圖：Authentication Error errorcode: 200 uid: -1 appid -1 msg: APP不存在

今天重新申請了個百度地圖的金鑰，結果總是出錯，報錯如下： Authentication Error errorcode: 200 uid: -1 appid -1 msg: APP不存在 我反覆檢查了sha1和包名是沒有問題的，最終發現需要手動在android studio

Android百度地圖開發學習筆記（二）之定位當前位置和自定義控制元件返回

在完成HelloMap後，接來完成的重要功能是如何定位當前位置和如何一鍵返回。效果圖如下： 這裡的控制元件就是一個ImageView，自己去百度一個好看的圖片就可以了。 一 定位當前位置和自定義控制元件返回 1.官方技術文件 可以先點選百度地圖定位技術文件，仔細看一下相關

Android app接入百度地圖：禁用手勢、模式切換、根據經緯度獲取位置資訊

嗯，沒錯，接入百度地圖後一般可能要用到的一些功能... 1.開啟交通圖 mBaiduMap.setTrafficEnabled(true); 2.模式切換 //衛星地圖 mBaiduMap.setMapType(BaiduMap.MAP_TYPE_SATELLITE)

百度地圖海量點清除（始終保留最新的點）

   將海量點新增到地圖上        var points_Point = [];         var options_Point = {                 size: BMAP_POINT_SIZE_SMALL,                 s

一個基於百度地圖的桌面軟體（附工程原始碼）

光陰似箭，日月如梭，恍然間，2013就這樣平平淡淡的過去了。想想工資卡上的餘額，心中不免浮起蛋蛋的憂桑。如果再回到2013。。。。。罷了，青春就是如此，每個人都肆無忌憚的揮霍著，在年華正當之時。或許只有當歲月的烙印狠狠落下的那一刻，我們才會想起那再也回不去的美好年華，那落英

百度地圖API學習筆記（三）

com.baidu.mapapi.map.GroundOverlay，定義在地圖上繪製一個 Ground 覆蓋物，繼承自com.baidu.mapapi.map.Overlay 欄位概要 從類繼承的欄位 com.baidu.mapapi.map.Overlay 方法概要

百度地圖根據座標自定義覆蓋物，並實現其點選事件

在很多APP中都會用到百度地圖，以實現各種功能，本片文章介紹在百度地圖中新增自定義覆蓋物並新增其點選事件 public class NearByFragment extends Fragment { private MapView mapView;

細讀百度地圖點聚合原始碼（上）

之前在專案中需要用到百度地圖的點聚合，看了百度提供的demo之後，稍微讀了一些原始碼就能達到需求了，所以並未深入解讀原始碼。 最近有空就把百度實現點聚合的原始碼從裡到外仔細研究了一遍受益良多，在此分享一下。 為了方便研究我把百度demo中點聚合相關的類抽出來，新建了個工程，

百度地圖：新的瓦片生成工具來了

    最新工具動態及下載：點選開啟連結         本來網上有這樣的瓦片生成工具，參見酸奶小妹的博文《【百度地圖API】如何製作一張魔獸地圖！！——CS地圖也可以，哈哈哈》（http://www.cnblogs.com/milkmap/archive/2011/05

百度地圖：230錯誤 APP Scode校驗失敗問題解決辦法

        因為我們在之前百度開放平臺上建立應用的時候要生成一個AK，然後這個AK=sha1 + 包名的之後得到的。而這個sha1又有兩種方式生成：一種是在cmd中按照文件的方式生成，另一種是通過ecplice中的 window - preferences -android - build 你就能看見那

Android 百度地圖新增自定義marker(覆蓋物)不顯示圖片的解決方法

在使用百度地圖新增自定義Marker View時,顯示不出來自定義marker view裡面的頭像,百度地圖的新增自定義marker顯示網路圖片本身就是一個坑(我是這樣認為的)... 我的需求是這樣的,當有人員上報位置時,就根據經緯度把人員位置資訊用自定義Marker去載入

百度地圖：定位，軌跡，白板，載入崩潰，定位到非洲

這兩天道長在弄百度地圖，開發中也遇到了一些問題，在這裡和大家分享一下（額，主要是記錄一下，省的下次又忘了） 一、準備 二、定位 1.百度地圖配置 新增許可權 <uses-permission android:name="a

百度地圖離線API開發（純粹的離線） GT小俠

         公司現在做的一個專案本來用的是google離線地圖，但是發現谷歌的地圖資料很久沒更新資料了，中國的城市發展這麼快，好多地方地圖和現實都對不上了。發現百度地圖資料更新挺快的（呵呵，畢竟是國產的嗎），最後公司決定要把google地圖換成百度地圖。就把此重任交個