1. 程式人生 > >百度地圖建立InfoWindow自定義View顯示

百度地圖建立InfoWindow自定義View顯示

在網上查閱資料發現各種答案,可能是度孃的原因,反正是沒有找到有效的方法。有的解決了,但方法超複雜,不忍直視了。

自己就去查閱百度API,在InfoWindow的構造方法:

    InfoWindow

    public InfoWindow(View view,
              LatLng position,
              int yOffset)

    通過傳入的 view 構造一個 InfoWindow, 此時只是利用該view生成一個Bitmap繪製在地圖中。

    引數:
        view - InfoWindow 展示的 view
        position - InfoWindow 顯示的地理位置
        yOffset - InfoWindow Y 軸偏移量
        listener - InfoWindow 點選監聽者
    丟擲:
        java.lang.IllegalArgumentException - view 和 position 不能為 null

發現了InfoWindow的構造方法中,第一引數要求的是View,那能不能傳入一個自定義的View呢,說幹就幹,就自己建立一個View,並將其傳入InfoWindow,核心程式碼如下:

//====================地圖長按監聽=============================

    @Override

    public void onMapLongClick(final LatLng latLng) {

        //將長按點設定為地圖顯示中心

        MapStatusUpdate mapStatusUpdate = MapStatusUpdateFactory.newLatLng(latLng);

        map.animateMapStatus(mapStatusUpdate);

        map.clear();//清空地圖上的標記

        //長按點位置顯示標記

        markerOptions = new MarkerOptions();

        markerOptions.position(latLng);

        BitmapDescriptor bitmapDescriptor = BitmapDescriptorFactory.fromResource(R.drawable.location1);

        markerOptions.icon(bitmapDescriptor);

        markerOptions.zIndex(9);

        Marker marker = (Marker) map.addOverlay(markerOptions);

        //從xml建立要顯示的View,並設定相應的值

        LayoutInflater inflater = LayoutInflater.from(getApplicationContext());

        View view = inflater.inflate(R.layout.layout_map_item, null);

        TextView txtLatLng = (TextView)view.findViewById(R.id.text_item_latlng);

        final EditText background = (EditText) view.findViewById(R.id.ed_item_background);

        final EditText keyWord = (EditText) view.findViewById(R.id.ed_item_keyword);

        Button btnSearch = (Button) view.findViewById(R.id.btn_search);

        Button btnCancel = (Button) view.findViewById(R.id.btn_cancel);

        txtLatLng.setText("緯度:"+latLng.latitude+",經度:"+latLng.longitude);

        final LatLng lngFinal = latLng;

        //點選view上面的檢索按鈕呼叫方法

        btnSearch.setOnClickListener(new View.OnClickListener() {

            @Override

            public void onClick(View v) {

                //Log.d("WorkMainActivity","搜尋附近500米");

                map.clear();//清空地圖上的標記

                String circumBackground = background.getText().toString();

                if(null==circumBackground||"".equals(circumBackground)){

                    return;

                }else {

                    String keyWordString = keyWord.getText().toString();

                    if(null==keyWordString||"".equals(keyWordString)){

                        return;

                    }else {

                        int circum = Integer.parseInt(circumBackground);

                        PoiNearbySearchOption poiNearbySearchOption = new PoiNearbySearchOption();

                        poiNearbySearchOption.location(lngFinal);

                        //以長按座標點為中心,畫指定半徑的圓,並制定透明度為100,作為搜尋範圍

                        CircleOptions circleOptions = new CircleOptions();

                        circleOptions.center(lngFinal);

                        circleOptions.radius(circum);

                        circleOptions.fillColor(Color.argb(100,28,95,167));

                        map.addOverlay(circleOptions);

                        poiNearbySearchOption.keyword(keyWordString);

                        poiNearbySearchOption.radius(circum);

                        poiSearch.searchNearby(poiNearbySearchOption);

                        poiSearch.setOnGetPoiSearchResultListener(WorkMainActivity.this);

                    }

                }

            }

        });

        //點選取消按鈕

        btnCancel.setOnClickListener(new View.OnClickListener() {

            @Override

            public void onClick(View v) {

                //Log.d("WorkMainActivity","取消搜尋");

                map.hideInfoWindow();

            }

        });

        InfoWindow infoWindow = new InfoWindow(view, latLng, -47);

        map.showInfoWindow(infoWindow);

    }

至於View的定義檔案,即layout_map_item檔案程式碼如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="wrap_content"
              android:background="#2B9685"
              android:layout_height="wrap_content">
    <TextView
            android:layout_width="100dp"
            android:layout_height="wrap_content"
            android:text="搜尋附近"
            android:textSize="20sp"
            android:layout_gravity="center_horizontal"
            android:gravity="center_horizontal"
            />
    <TextView
            android:id="@+id/text_item_latlng"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:background="#37B158"
            />
    <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
        <EditText
                android:id="@+id/ed_item_background"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="#58C7F9"
                android:hint="範圍(m)"
                />
        <EditText
                android:id="@+id/ed_item_keyword"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="#BCEAA7"
                android:hint="關鍵字"

                />
    </LinearLayout>
    <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
        <Button
                android:id="@+id/btn_search"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:background="#BABA66"
                android:textSize="20sp"
                android:text="檢索"
                android:layout_weight="1"
                />
        <Button
                android:id="@+id/btn_cancel"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:background="#BABAFF"
                android:textSize="20sp"
                android:layout_weight="1"
                android:text="取消"
                />
    </LinearLayout>


</LinearLayout>

結果發現,確實可行,執行效果如下:(注:該程式編譯版本API 19,需要手機,模擬器4.4.2以上的版本才能正常執行,如果版本過低,可以更改AndroidManifest.xml中的<uses-sdk android:minSdkVersion="19"/>標籤,改成相應版本即可)


(下面附上程式全部程式碼)

下載原始碼

相關推薦

地圖建立InfoWindow定義View顯示

在網上查閱資料發現各種答案,可能是度孃的原因,反正是沒有找到有效的方法。有的解決了,但方法超複雜,不忍直視了。 自己就去查閱百度API,在InfoWindow的構造方法: InfoWindow public InfoWindow(View view, LatLn

地圖的覆蓋物定義(二)--資訊視窗的定義(呼叫白茹提供的資訊視窗InfoWindow

百度地圖的覆蓋物自定義(而)--資訊視窗的自定義(呼叫白茹提供的資訊視窗InfoWindow) var point=new BMap.Point(111.54525,45.578); setInfo

Android定位&地圖&導航——基於地圖,實現定義圖示繪製並點選時彈出泡泡

public class MainActivity extends Activity { private EditText txtAddr; // 定位相關 LocationClient mLocClient; LocationData locData = nul

地圖點聚合定義marker

效果如圖自定義ClusterItem類 /** * 每個Marker點,包含Marker點座標以及圖示 */ public class MyClusterItem implements ClusterItem { private final LatLng

IOS地圖氣泡內容定義

 最簡單,最直接的方法。。。 自定義一個 UIView 核心程式碼如下: //改變標註圖片和自定義氣泡 -(BMKAnnotationView *)mapView:(BMKMapView *)mapView viewForAnnotation:(id<BMKAnno

地圖根據座標定義覆蓋物,並實現其點選事件

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

iOS開發之地圖大頭針的定義解決方法

方法1 - (BMKAnnotationView *)mapView:(BMKMapView *)mapView viewForAnnotation:(id <BMKAnnotation>

分享怎麽 定義圖片分享 【原創】

多功能 有道 amp popu har dia 1.0 例如 IV 我們在應用百度分享插件的時候, 默認如果開啟圖片分享的話,連很多小圖標也分享了,實在惱火! 去掉圖片分享吧,分享效果又不好。。。 如何做到自定義圖片分享呢? 就是預先定義tag標簽 例如: "tag":

使用Echart搭配地圖建立某一地區熱點圖的注意點

使用Echart搭配百度地圖建立的熱點圖,為網友免費做的demo,細節沒有調整.記錄一下寫的過程. 效果圖: 程式碼: <!DOCTYPE html> <html style="height: 100%"> <head>

ueditor富文字--定義外掛按鈕

我們在在之前的文章中講了 百度ueditor富文字 的 配置和初始化的方法。我們可以給它配置更多的外掛,全部外掛可參考官網:如果官網提供的外掛仍不能滿足我們的需要時,則可以自定義外掛按鈕。比如 我們這裡

地圖建立標記點

專案需求:專案需要從資料庫載入資料到百度地圖上,顯示未標記點。 js程式碼如下: //建立地圖 function showMap(){ map = new BMap.Map("information_date",{minZoom:6,maxZoom:17});

關於地圖 BMap.InfoWindow顯示最後一條資訊解決方法

今天遇到這個問題了。後面再網上搜搜,發現都是你抄我,我轉載你的,後來無意看到一篇文章,說是用閉包後來解決了。現在把問題解決方法發出來 [javascript] view plaincopyprint? function baiduMapFunction(div

地圖建立標註marker,最優縮放級別

 百度地圖建立marker座標,新增自定義標註: //首先要引入百度api <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0& ak=你的金鑰&s=1">

JQuery實現選單切換--以地圖InfoWindow為例

  在網頁設計中,很多元素的外觀顯示與其真正的內部實現其實並不完全一致,正如前邊qq的顯示面板示例一樣,給人的直觀感覺有點小複雜,但其實質就是個ul。本文所示例的切換選單也一樣,外觀看起來也有點複雜,但其實質很簡單,同樣可以通過ul實現。 本文使用JQuery來實現,相對於

地圖生成器添加標註不顯示

圖標 技術 路徑 api 發現 不顯示 HR baidu images 最近發現百度地圖生成器生成的地圖中標註的圖片不顯示,如下圖: 很明顯了,就是這個圖標路徑(http://app.baidu.com/map/images/us_mk_icon.png)的問題 在

地圖api定位,根據經緯度顯示當前城市名

當前城市:<span id="pro_num">鄭州</span> <div id="allmap"></div> <script type="text/javascript" src="http://api.map.baidu.com/

解決iframe載入過地圖後不在iframe裡顯示問題

問題: 最近用layui搭的一個框架,內容主題部分用的是iframe,但是載入過百度地圖那個頁面後再點選其他的選單就會在新頁面開啟,而不是在iframe裡打開了。 解決: 還是原來的iframe <iframe id="optionId" name="op

Android 地圖開發(一)如何呼叫地圖介面和在專案中顯示地圖以及實現定位

二、下載百度地圖API庫 然後新增到專案中即可。   三、在專案清單AndroidMainifest.xml配置百度地圖API key和新增相關許可權                         四、在專案呼叫百度地圖專案功能,這篇文章就首先講講顯示地圖和定位的功能 首先

Android 地圖-大量覆蓋物管理(只顯示螢幕看到的覆蓋物)

在開發百度地圖中,如果你需要在地圖上一次性載入上千個覆蓋物,你的app會變成什麼樣?會因為你佔用了app大部分記憶體,導致app執行很慢,甚至OOM。 我在剛開始開發學習這塊的時候,發現網上並沒有太多的關於這方面的解決方法。這裡我給出我使用的解決方法。 思想

AndroidStudio 地圖在打包後失效,顯示不出地圖

今天下午碰到的,我簽名後的apk,一切都正常,但是到地圖這一塊的時候就出現了問題,地圖老是顯示不出來。顯示的是網格。我在網上找了好多的資料。最後整合各位前輩的經驗,以下就是我的解決方案: