本文主要講解如何實現在百度地圖上添加覆蓋物

1.承載數據的實體

我們從服務器返回的數據部分，最終可能是個Json數組，我們需要轉換為實體集合，即下面的Info.java
我直接在實體類中聲明了一個靜態列表集合，模擬從服務器返回的數據Info.infos

package com.zj.map2;import java.io.Serializable; import java.util.ArrayList; import java.util.List; public class Info implements Serializable { private static final long serialVersionUID = -758459502806858414L; /** * 精度 */ private double latitude; /** * 緯度 */ private double longitude; /** * 圖片ID，真實項目中可能是圖片路徑 */ private int imgId; /** * 商家名稱 */ private String name; /** * 距離 */ private String distance; /** * 贊數量 */ private int zan; public static List<Info> infos = new ArrayList<Info>(); static { infos.add(new Info(34.242652, 108.971171, R.drawable.a01, "英倫貴族小旅館", "距離209米", 1456)); infos.add(new Info(34.242952, 108.972171, R.drawable.a02, "沙井國際洗浴會所", "距離897米", 456)); infos.add(new Info(34.242852, 108.973171, R.drawable.a03, "五環服裝城", "距離249米", 1456)); infos.add(new Info(34.242152, 108.971971, R.drawable.a04, "老米家泡饃小炒", "距離679米", 1456)); } public Info() { } public Info(double latitude, double longitude, int imgId, String name, String distance, int zan) { super(); this.latitude = latitude; this.longitude = longitude; this.imgId = imgId; this.name = name; this.distance = distance; this.zan = zan; } public double getLatitude() { return latitude; } public void setLatitude(double latitude) { this.latitude = latitude; } public double getLongitude() { return longitude; } public void setLongitude(double longitude) { this.longitude = longitude; } public String getName() { return name; } public int getImgId() { return imgId; } public void setImgId(int imgId) { this.imgId = imgId; } public void setName(String name) { this.name = name; } public String getDistance() { return distance; } public void setDistance(String distance) { this.distance = distance; } public int getZan() { return zan; } public void setZan(int zan) { this.zan = zan; } }

在地圖中添加overlay

/** * 初始化圖層 */ public void addInfosOverlay(List<Info> infos) { mBaiduMap.clear(); LatLng latLng = null; OverlayOptions overlayOptions = null; Marker marker = null; for (Info info : infos) { // 位置 latLng = new LatLng(info.getLatitude(), info.getLongitude()); // 圖標 overlayOptions = new MarkerOptions().position(latLng) .icon(mIconMaker).zIndex(5); marker = (Marker) (mBaiduMap.addOverlay(overlayOptions)); Bundle bundle = new Bundle(); bundle.putSerializable("info", info); marker.setExtraInfo(bundle); } // 將地圖移到到最后一個經緯度位置 MapStatusUpdate u = MapStatusUpdateFactory.newLatLng(latLng); mBaiduMap.setMapStatus(u); }

為地圖上的maker添加點擊事件

（記得生成TextView的時候，先設置背景，再設置padding，不然可能會失效~~~）

private void initMarkerClickEvent(){// 對Marker的點擊mBaiduMap.setOnMarkerClickListener(new OnMarkerClickListener(){@Overridepublic boolean onMarkerClick(final Marker marker){// 獲得marker中的數據Info info = (Info) marker.getExtraInfo().get("info");InfoWindow mInfoWindow;// 生成一個TextView用戶在地圖中顯示InfoWindowTextView location = new TextView(getApplicationContext());location.setBackgroundResource(R.drawable.location_tips);location.setPadding(30, 20, 30, 50);location.setText(info.getName());// 將marker所在的經緯度的信息轉化成屏幕上的坐標final LatLng ll = marker.getPosition();Point p = mBaiduMap.getProjection().toScreenLocation(ll);p.y -= 47;LatLng llInfo = mBaiduMap.getProjection().fromScreenLocation(p);// 為彈出的InfoWindow添加點擊事件//mInfoWindow=new InfoWindow(location);mInfoWindow = new InfoWindow(location, llInfo,0);location.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {// TODO Auto-generated method stubmBaiduMap.hideInfoWindow();}});// 顯示InfoWindowmBaiduMap.showInfoWindow(mInfoWindow);// 設置詳細信息布局為可見mMarkerInfoLy.setVisibility(View.VISIBLE);// 根據商家信息為詳細信息布局設置信息popupInfo(mMarkerInfoLy, info);return true;}});}

布局文件

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context="${relativePackage}.${activityClass}" ><com.baidu.mapapi.map.MapView android:id="@+id/id_bmapView"android:layout_width="fill_parent"android:layout_height="fill_parent"android:clickable="true" /><RelativeLayout android:id="@+id/id_marker_info" android:visibility="gone" android:layout_width="fill_parent" android:layout_height="220dp" android:layout_alignParentBottom="true" android:background="#CC4e5a6b" android:clickable="true" > <ImageView android:id="@+id/info_img" android:layout_width="fill_parent" android:layout_height="150dp" android:layout_marginBottom="10dp" android:layout_marginLeft="12dp" android:layout_marginRight="12dp" android:layout_marginTop="10dp" android:alpha="1.0" android:background="@drawable/map_image_border_white" android:clickable="true" android:scaleType="fitXY" android:src="@drawable/a04" /> <RelativeLayout android:layout_width="fill_parent" android:layout_height="50dp" android:layout_alignParentBottom="true" android:background="@drawable/bg_map_bottom" > <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_centerVertical="true" android:layout_marginLeft="20dp" android:orientation="vertical" > <TextView android:id="@+id/info_name" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="老米家泡饃小炒" android:textColor="#FFF5EB" /> <TextView android:id="@+id/info_distance" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="距離200米" android:textColor="#FFF5EB" /> </LinearLayout> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:layout_marginRight="20dp" android:orientation="horizontal" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:onClick="zan" android:src="@drawable/map_zan" /> <TextView android:id="@+id/info_zan" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="652" android:textColor="#FFF5EB" /> </LinearLayout> </RelativeLayout> </RelativeLayout> </RelativeLayout>

MainActivity完整代碼

package com.zj.map2;import java.util.List;import com.baidu.mapapi.SDKInitializer; import com.baidu.mapapi.map.BaiduMap; import com.baidu.mapapi.map.BaiduMap.OnMapClickListener; import com.baidu.mapapi.map.BaiduMap.OnMarkerClickListener; import com.baidu.mapapi.map.BitmapDescriptor; import com.baidu.mapapi.map.BitmapDescriptorFactory; import com.baidu.mapapi.map.InfoWindow; import com.baidu.mapapi.map.MapPoi; import com.baidu.mapapi.map.MapStatusUpdate; import com.baidu.mapapi.map.MapStatusUpdateFactory; import com.baidu.mapapi.map.MapView; import com.baidu.mapapi.map.Marker; import com.baidu.mapapi.map.MarkerOptions; import com.baidu.mapapi.map.OverlayOptions; import com.baidu.mapapi.model.LatLng;import android.app.Activity; import android.graphics.Point; import android.os.Bundle; import android.view.Menu; import android.view.MenuItem; import android.view.View; import android.view.View.OnClickListener; import android.widget.ImageView; import android.widget.RelativeLayout; import android.widget.TextView;public class MainActivity extends Activity {MapView mapView;BaiduMap mBaiduMap;// 初始化全局 bitmap 信息，不用時及時 recycleprivate BitmapDescriptor mIconMaker;private RelativeLayout mMarkerInfoLy;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);SDKInitializer.initialize(getApplicationContext());setContentView(R.layout.activity_main);mapView=(MapView) findViewById(R.id.id_bmapView);mMarkerInfoLy = (RelativeLayout) findViewById(R.id.id_marker_info);mBaiduMap=mapView.getMap();mIconMaker = BitmapDescriptorFactory.fromResource(R.drawable.maker);MapStatusUpdate msu = MapStatusUpdateFactory.zoomTo(15.0f);mBaiduMap.setMapStatus(msu);initMarkerClickEvent();initMapClickEvent();}private void initMapClickEvent(){mBaiduMap.setOnMapClickListener(new OnMapClickListener(){@Overridepublic boolean onMapPoiClick(MapPoi arg0){return false;}@Overridepublic void onMapClick(LatLng arg0){mMarkerInfoLy.setVisibility(View.GONE);mBaiduMap.hideInfoWindow();}});}private void initMarkerClickEvent(){// 對Marker的點擊mBaiduMap.setOnMarkerClickListener(new OnMarkerClickListener(){@Overridepublic boolean onMarkerClick(final Marker marker){// 獲得marker中的數據Info info = (Info) marker.getExtraInfo().get("info");InfoWindow mInfoWindow;// 生成一個TextView用戶在地圖中顯示InfoWindowTextView location = new TextView(getApplicationContext());location.setBackgroundResource(R.drawable.location_tips);location.setPadding(30, 20, 30, 50);location.setText(info.getName());// 將marker所在的經緯度的信息轉化成屏幕上的坐標final LatLng ll = marker.getPosition();Point p = mBaiduMap.getProjection().toScreenLocation(ll);p.y -= 47;LatLng llInfo = mBaiduMap.getProjection().fromScreenLocation(p);// 為彈出的InfoWindow添加點擊事件//mInfoWindow=new InfoWindow(location);mInfoWindow = new InfoWindow(location, llInfo,0);location.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {// TODO Auto-generated method stubmBaiduMap.hideInfoWindow();}});// 顯示InfoWindowmBaiduMap.showInfoWindow(mInfoWindow);// 設置詳細信息布局為可見mMarkerInfoLy.setVisibility(View.VISIBLE);// 根據商家信息為詳細信息布局設置信息popupInfo(mMarkerInfoLy, info);return true;}});}/** * 根據info為布局上的控件設置信息 * * @param mMarkerInfo2 * @param info */ protected void popupInfo(RelativeLayout mMarkerLy, Info info) { ViewHolder viewHolder = null; if (mMarkerLy.getTag() == null) { viewHolder = new ViewHolder(); viewHolder.infoImg = (ImageView) mMarkerLy .findViewById(R.id.info_img); viewHolder.infoName = (TextView) mMarkerLy .findViewById(R.id.info_name); viewHolder.infoDistance = (TextView) mMarkerLy .findViewById(R.id.info_distance); viewHolder.infoZan = (TextView) mMarkerLy .findViewById(R.id.info_zan); mMarkerLy.setTag(viewHolder); } viewHolder = (ViewHolder) mMarkerLy.getTag(); viewHolder.infoImg.setImageResource(info.getImgId()); viewHolder.infoDistance.setText(info.getDistance()); viewHolder.infoName.setText(info.getName()); viewHolder.infoZan.setText(info.getZan() + ""); } /** * 復用彈出面板mMarkerLy的控件 * * @author zhy * */ private class ViewHolder { ImageView infoImg; TextView infoName; TextView infoDistance; TextView infoZan; } @Overridepublic boolean onCreateOptionsMenu(Menu menu) {// TODO Auto-generated method stubgetMenuInflater().inflate(R.menu.main, menu);return super.onCreateOptionsMenu(menu);}@Overridepublic boolean onOptionsItemSelected(MenuItem item) {// TODO Auto-generated method stubswitch (item.getItemId()) {case R.id.id_menu_map_addMaker:addInfosOverlay(Info.infos);break;default:break;}return super.onOptionsItemSelected(item);}/*** 初始化圖層*/public void addInfosOverlay(List<Info> infos){mBaiduMap.clear();LatLng latLng = null;OverlayOptions overlayOptions = null;Marker marker = null;for (Info info : infos){// 位置latLng = new LatLng(info.getLatitude(), info.getLongitude());// 圖標overlayOptions = new MarkerOptions().position(latLng).icon(mIconMaker).zIndex(5);marker = (Marker) (mBaiduMap.addOverlay(overlayOptions));Bundle bundle = new Bundle();bundle.putSerializable("info", info);marker.setExtraInfo(bundle);}// 將地圖移到到最后一個經緯度位置MapStatusUpdate u = MapStatusUpdateFactory.newLatLng(latLng);mBaiduMap.setMapStatus(u);} }

參考鏈接：

Android 百度地圖 SDK v3.0.0 （三） 添加覆蓋物Marker與InfoWindow的使用 - Hongyang - 博客頻道 - CSDN.NET

效果如下

總結

以上是生活随笔為你收集整理的百度地图之添加覆盖物的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。