1. 程式人生 > >Android 高德地圖自定義地圖覆蓋物(Marker)

Android 高德地圖自定義地圖覆蓋物(Marker)

先上效果圖,攝像頭和攝像頭上的預警事件紅點就是一個自定義佈局作為地圖的marker的圖示。

       

      

camera_red.png (素材圖)

官方提供的API參考手冊:http://a.amap.com/lbs/static/unzip/Android_Map_Doc/index.html, maker圖示設定如下截圖所示

       所謂自定義覆蓋物,其實就是將一般的圖片背景轉成的BitmapDescriptor換成用自定義佈局轉換成BitmapDescriptor的方式而已,畫好自定義view,經過動態載入轉成BitmapDescriptor給icon()賦值即可,程式碼如下:

自定義view:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="60dp"
    android:layout_height="60dp">

    <ImageView
        android:id="@+id/iv_maker_bg"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:src="@mipmap/camera_red"/>

    <TextView
        android:id="@+id/txt_count"
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:background="@drawable/round_count"
        android:gravity="center"
        android:text="3"
        android:textColor="@color/white"
        android:textSize="12sp" />


</RelativeLayout>

round_count.xml

<?xml version="1.0" encoding="utf-8"?>
<!--  圓角  -->

<shape xmlns:android="http://schemas.android.com/apk/res/android">
android:shape="rectangle">
<solid android:color="@color/red"></solid>

<corners android:radius="180dp"></corners>
</shape>

 

繪製核心函式程式碼,呼叫第一個就行:

    //繪製覆蓋物(攝像頭list)
    private void addOverlayCamera(AMap aMap, List<CameraInfoBean> points) {
        clearCamera();
        cameraMarkerList.clear();
        for (CameraInfoBean bean: points) {
            LatLng latLng = new LatLng(bean.getDeviceLat(),bean.getDeviceLng());
            MarkerOptions markerOption = new MarkerOptions();
            markerOption.position(latLng);
        
            View view = getMarkerCountView(0,R.mipmap.camera_offline);
            markerOption.icon(BitmapDescriptorFactory.fromView(view));
            

            Marker marker = aMap.addMarker(markerOption);
            marker.setObject(bean);
            cameraMarkerList.add(marker);
        }
    }


    public View getMarkerCountView(int count,int icon) {
        View view = this.getLayoutInflater().inflate(R.layout.ll_map_count_info, null);
        ImageView imageView = (ImageView)view.findViewById(R.id.iv_maker_bg);
        imageView.setImageResource(icon);
        TextView txt_count = (TextView) view.findViewById(R.id.txt_count);
        if (count > 0) {
            txt_count.setText(String.valueOf(count));
            txt_count.setVisibility(View.VISIBLE);
        } else {
            txt_count.setVisibility(View.GONE);
        }
        return view;
    }