在地图上创建自定义覆盖层

Question

我正在尝试在Android中复制Maps的以下功能： 你可以看到，地图上有一个圆圈表示用户选择的范围。

在我的应用程序中，我也希望有一个拖动器驻留在圆的周长上，可以将其拖动以重新定义半径。

如果有人能告诉我如何在地图上绘制自定义可绘制叠加层和2D图形，我就可以自己完成其他事情了。

谢谢！

完整的应用程序可以通过此链接访问。

- Aman Alam

---

看看这个库，它恰好具有这个功能：https://github.com/i-schuetz/map_areas - User

Answer 1

好的，我尝试自己做事情，并放置了这段代码以获得上述效果：

public class MarkerOverlay extends Overlay {

    Geocoder geoCoder = null;

    public MarkerOverlay() {
        super();
    }


    @Override
    public boolean onTap(GeoPoint geoPoint, MapView mapView){
        selectedLatitude = geoPoint.getLatitudeE6(); 
        selectedLongitude = geoPoint.getLongitudeE6();
        return super.onTap(geoPoint,mapView);
    }

    @Override
    public void draw(Canvas canvas, MapView mapV, boolean shadow){

        if(shadow){
            Projection projection = mapV.getProjection();
            Point pt = new Point();
            projection.toPixels(globalGeoPoint,pt);

            GeoPoint newGeos = new GeoPoint(selectedLat+(100),selectedLong); // adjust your radius accordingly
            Point pt2 = new Point();
            projection.toPixels(newGeos,pt2);
            float circleRadius = Math.abs(pt2.y-pt.y);

            Paint circlePaint = new Paint(Paint.ANTI_ALIAS_FLAG);

            circlePaint.setColor(0x30000000);
            circlePaint.setStyle(Style.FILL_AND_STROKE);
            canvas.drawCircle((float)pt.x, (float)pt.y, circleRadius, circlePaint);

            circlePaint.setColor(0x99000000);
            circlePaint.setStyle(Style.STROKE);
            canvas.drawCircle((float)pt.x, (float)pt.y, circleRadius, circlePaint);

            Bitmap markerBitmap = BitmapFactory.decodeResource(getApplicationContext().getResources(),R.drawable.pin);
            canvas.drawBitmap(markerBitmap,pt.x,pt.y-markerBitmap.getHeight(),null);

            super.draw(canvas,mapV,shadow);
        }
    }
}

这让我产生了以下影响：

所使用的计算可能不是您想要的。
它只是用于演示目的。
真实的范围/距离计算还需要使用方位角，并具有某些特定的公式。
如果您对此有任何问题，请告诉我。

- Aman Alam

---

选定的纬度和经度是什么？你在哪里使用了纬度、经度数值？请指导我，我想实现同样的功能。 - UMAR-MOBITSOLUTIONS

并请粘贴使用谷歌地图的代码。您如何称呼这个类，任何帮助都将不胜感激。 - UMAR-MOBITSOLUTIONS

抱歉，这是用户点击的纬度/经度。这是一个保存这些值的全局变量。这个类是我的MapActivity的内部类。 - Aman Alam

你怎么从谷歌地图中调用它？为了创建当前的覆盖项，你能否请添加那段代码，以便我可以利用它？ - UMAR-MOBITSOLUTIONS

在添加叠加层时，请使用此类。每当Android绘制地图瓦片（缩放、平移等）时，onDraw()方法将始终被调用。 - Aman Alam

Answer 2

扩展类ItemizedOverlay以覆盖draw()方法。传递了绘制叠加层的Canvas到该方法中，您可以调用drawCircle或任何必要的内容来使您的范围拖动器出现。

- ognian

---

这是一个不错的选择，但正如上面的图片所示，我需要知道标记当前所在的点。首先它会给我地理坐标点，然后我需要将它们转换成屏幕像素格式（类似于x，y的坐标），对此我无能为力！ :-/ - Aman Alam

请查看以下内容：http://code.google.com/android/add-ons/google-apis/reference/com/google/android/maps/MapView.html#getProjection%28%29 - ognian

太棒了，我得到了鼠标的坐标。然而，由于我还在使用onTap方法在用户点击的位置放置标记，覆盖draw()方法后，onTap机制不起作用了。因为它以前调用默认的draw()方法来放置标记，而现在我已经覆盖了它。有什么解决办法吗？ - Aman Alam

Answer 3

绘制带圆圈的图钉的示例代码：

public class MapDemoActivity extends MapActivity {
    MapView mapView;
    MapController mc;
    GeoPoint p;

    @Override
    public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    mapView = (MapView) findViewById(R.id.mapView);
    LinearLayout zoomLayout = (LinearLayout)findViewById(R.id.zoom);  
    View zoomView = mapView.getZoomControls(); 

    zoomLayout.addView(zoomView, 
        new LinearLayout.LayoutParams(
            LayoutParams.WRAP_CONTENT, 
            LayoutParams.WRAP_CONTENT)); 
    mapView.displayZoomControls(true);

    mc = mapView.getController();        
    String coordinates[] = {"28.38", "77.12"};
    double lat = Double.parseDouble(coordinates[0]);
    double lng = Double.parseDouble(coordinates[1]);

    p = new GeoPoint(
        (int) (lat * 1E6), 
        (int) (lng * 1E6));

    mc.animateTo(p);
    mc.setZoom(8); 
    //---Add a location marker---
    MapOverlay mapOverlay = new MapOverlay();
    List<Overlay> listOfOverlays = mapView.getOverlays();
    listOfOverlays.clear();
    listOfOverlays.add(mapOverlay);        
    mapView.invalidate();
    }

    class MapOverlay extends com.google.android.maps.Overlay
{
    @Override
    public boolean draw(Canvas canvas, MapView mapView, 
    boolean shadow, long when) 
    {
        super.draw(canvas, mapView, shadow);                   

        //---translate the GeoPoint to screen pixels---
        Point screenPts = new Point();
        mapView.getProjection().toPixels(p, screenPts);
        //--------------draw circle----------------------            

        Point pt=mapView.getProjection().toPixels(p,screenPts);

        Paint circlePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        circlePaint.setColor(0x30000000);
        circlePaint.setStyle(Style.FILL_AND_STROKE);
        canvas.drawCircle(screenPts.x, screenPts.y, 50, circlePaint);           

        //---add the marker---
        Bitmap bmp = BitmapFactory.decodeResource(
            getResources(), R.drawable.pin);            
        canvas.drawBitmap(bmp, screenPts.x, screenPts.y-bmp.getHeight(), null);              
        super.draw(canvas,mapView,shadow);

        return true;

    }
}
@Override
protected boolean isRouteDisplayed() {
    // TODO Auto-generated method stub
    return false;
}
}

- Monica M

---

嗨manaco，我在运行代码时有一些疑问。 关于缩放功能，是否有缩放按钮或其他方式？ - NovusMobile

@denny 我已经在main.xml中使用了缩放控件。请参考此链接以获取更多关于地图的信息：link - Monica M