天地圖值之新增覆蓋物
阿新 • • 發佈：2018-11-20
最近多少還是會有一點焦慮，其實很大一部分原因是考慮的比較多罷了，適當的放棄一些東西，一切就會變的明朗起來。
接著上一篇繼續來學習天地圖 Android SDK ，地圖開發中除了常見的定位需求，還有就是覆蓋物的新增，比如最近的專案是有關風險管控的，在地圖上就要顯示對應的風險點，下面的今天的內容：
- 單個覆蓋物
- 多個覆蓋物
- 集合覆蓋物
- 文字覆蓋物
- 總結
- 測試效果
單個覆蓋物
這裡單個覆蓋物的新增使用資原始檔夾裡面的圖片作為具體覆蓋物，下面是自定義的一個 Overlay，具體如下：
/**
* Powered by jzman.
* Created on 2018/6/25 0025.
*/ 然後，將該 Overlay 新增到 MapVIew 中，具體如下：
mapView.addOverlay(new MOverlay(this));
到此，新增單個覆蓋物就完成了。
多個覆蓋物
開發中經常需要在地圖上標註一組資料相關的位置，此時就需要在地圖上新增多個覆蓋物了，新增一組相似型別的覆蓋物使用到抽象類 ItemizedOverlay，下面是自定義多個覆蓋物的一個 Overlay，具體如下：
/**
* Powered by jzman.
* Created on 2018/6/25 0025.
*/
public class MItemOverlay2 extends ItemizedOverlay<OverlayItem> {
private MapView mapView;
private View view;
private TextView tvItemOverlay;
private ArrayList<OverlayItem> items;
private ArrayList<DefaultGeoPoint<MarkerBean>> points;
public MItemOverlay2(Drawable defaultMarker, ArrayList<DefaultGeoPoint<MarkerBean>> geoPoints, MapView mapView, View view) {
super(defaultMarker);
this.mapView = mapView;
this.view = view;
tvItemOverlay = view.findViewById(R.id.tvItemOverlayData);
items = new ArrayList<>();
points = geoPoints;
for (int i = 0; i < points.size(); i++) {
OverlayItem overlayItem = new OverlayItem(points.get(i),
points.get(i).getT().getTitle(),
points.get(i).getT().getSnippet());
overlayItem.setMarker(defaultMarker);
items.add(overlayItem);
}
populate();
}
/**
* 覆蓋物條目總數
* @return
*/
@Override
public int size() {
return items.size();
}
/**
* 建立覆蓋物條目
* @param i
* @return
*/
@Override
protected OverlayItem createItem(int i) {
return items.get(i);
}
/**
* 處理點選事件
* @param index
* @return
*/
@Override
protected boolean onTap(int index) {
if (index == -1) return false;
mapView.updateViewLayout(view, new MapView.LayoutParams(
ViewGroup.LayoutParams.WRAP_CONTENT,
ViewGroup.LayoutParams.WRAP_CONTENT,
points.get(index),
MapView.LayoutParams.BOTTOM_CENTER));
tvItemOverlay.setText(points.get(index).getT().getTitle());
view.setVisibility(View.VISIBLE);
return true;
}
}設定點選每個覆蓋物彈出的 View 必須已經被新增到 MapView 中，具體如下：
mapView.addView(view, new MapView.LayoutParams(
ViewGroup.LayoutParams.WRAP_CONTENT,
ViewGroup.LayoutParams.WRAP_CONTENT,
null,
MapView.LayoutParams.TOP_LEFT));如果沒有出現新增，則會出錯，出錯資訊如下：
> java.lang.IllegalArgumentException: Given view not a child of com.tianditu.android.maps.MapView{ac3dbd7 V.E...... ........ 0,192-1080,1692 #7f070050 app:id/mapView}然後，將該 Overlay 新增到 MapVIew 中，具體如下：
Drawable drawable1 = getResources().getDrawable(R.drawable.selected_marker);
MItemOverlay2 mItemOverlay2 = new MItemOverlay2(drawable1, markers, mapView, view);
mapView.getOverlays().add(mItemOverlay2);到此，新增多個覆蓋物就完成了。
幾何覆蓋物
集合覆蓋物主要就是使用幾何圖形標註相關位置點，下面自定義了一個 Overlay，通過點選地圖位置新增幾何覆蓋物，效果可參考文末測試效果圖，具體如下：
/**
* Powered by jzman.
* Created on 2018/6/25 0025.
*/
public class GeometricOverlay extends Overlay{
private CircleArcOption mCircleArcOption;
private GeoPoint mGeoPoint;
public GeometricOverlay() {
mCircleArcOption = new CircleArcOption();
//設定覆蓋物是否是虛線
mCircleArcOption.setDottedLine(true);
//設定填充顏色
mCircleArcOption.setFillColor(Color.GRAY);
//設定邊框顏色
mCircleArcOption.setStrokeColor(Color.BLACK);
//設定邊框寬度
mCircleArcOption.setStrokeWidth(5);
//是否使用中心點,設定true,繪製出的是扇形，反之則是圓弧
mCircleArcOption.setUseCenter(true);
//設定起始角度以及掃描角度
mCircleArcOption.setAngle(0,100);
}
@Override
public boolean draw(GL10 gl, MapView mapView, boolean shadow, long when) {
MapViewRender render = mapView.getMapViewRender();
render.drawCircleArc(gl,mCircleArcOption,mGeoPoint,1000);
return true;
}
@Override
public boolean onTap(GeoPoint p, MapView mapView) {
//指定當前點選的位置新增覆蓋物，也可以自己指定
mGeoPoint = p;
return true;
}
}然後，將該 Overlay 新增到 MapVIew 中，具體如下：
mapView.addOverlay(new GeometricOverlay());到此，新增多個覆蓋物就完成了。
文字覆蓋物
文字覆蓋物就是在相應的位置點新增文字，下面自定義了一個 Overlay，通過點選地圖位置新增文字覆蓋物，效果可參考文末測試效果圖，具體如下：
/**
* Powered by jzman.
* Created on 2018/6/25 0025.
*/
public class TextOverlay extends Overlay{
private FontOption mFontOption;
private GeoPoint mGeoPoint;
public TextOverlay(Context context) {
mFontOption = new FontOption();
//設定填充顏色
mFontOption.setFillColor(Color.RED);
//設定字型顏色、字型大小
mFontOption.setFontColor(Color.BLACK);
mFontOption.setFontSize(60);
//設定文字邊框寬度、邊框顏色
mFontOption.setStrokeWidth(4);
mFontOption.setStrokeColor(Color.GRAY);
//設定文字旋轉角度
mFontOption.setTextRotate(60);
//設定字型
Typeface typeface = Typeface.createFromAsset(context.getAssets(), "font/font.ttf");
mFontOption.setFontTypeface(typeface);
}
@Override
public boolean draw(GL10 gl, MapView mapView, boolean shadow, long when) {
MapViewRender render = mapView.getMapViewRender();
if (mGeoPoint!=null){
render.drawText(gl,mFontOption,"這是文字覆蓋物",mGeoPoint);
}
return true;
}
@Override
public boolean onTap(GeoPoint p, MapView mapView) {
//指定當前點選的位置新增覆蓋物，也可以自己指定
mGeoPoint = p;
return true;
}
}然後，將該 Overlay 新增到 MapVIew 中，具體如下：
mapView.addOverlay(new TextOverlay(this));到此，新增多個覆蓋物就完成了。
總結
綜上所述，使用天地圖新增覆蓋物的一般步驟具體如下：
- 建立具體覆蓋物的 Overlay
- 初始化覆蓋物具體引數
- 重寫 draw() 方法
- 將該 Overlay 新增到 MapView 中
測試效果
可以選擇關注微信公眾號：jzman-blog 獲取最新更新，一起交流學習!
