Создание пользовательского наложения на карту

Я пытаюсь воспроизвести эту функцию Карт в Android: Custom Map Overlay

Вы можете видеть, что на карте есть кружок, изображающий диапазон, выбранный пользователем.

В моем приложении я также хочу, чтобы по периметру круга располагался перетаскиватель, который можно перетаскивать, чтобы переопределить радиус.

Если бы кто-нибудь мог сказать мне, как рисовать настраиваемые накладываемые изображения и 2D-графику поверх карты, я мог бы делать другие вещи самостоятельно.

Спасибо!

Полное приложение доступно по этой ссылке.


person Aman Alam    schedule 13.12.2010    source источник
comment
Проверьте эту библиотеку, она имеет именно такую ​​функциональность: github.com/i-schuetz/map_areas   -  person User    schedule 15.10.2014


Ответы (3)


Хорошо, я попытался сделать что-то самостоятельно и поместил этот код, чтобы получить вышеуказанный эффект:

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);
        }
    }
}

Это позволило мне иметь следующий эффект:

Эффект на карте

Используемый расчет может не совпадать с тем, что вам нужно.
Он предназначен только для демонстрационных целей.
Расчет реальной дальности/расстояния также требует использования пеленга и имеет определенную формулу.
Дайте мне знать, если вы есть вопросы по этому поводу.

person Aman Alam    schedule 21.01.2011
comment
что такое выбранная широта и долгота? где вы использовали значения широты, долготы? пожалуйста, помогите, я хочу реализовать то же самое. - person UMAR-MOBITSOLUTIONS; 16.04.2011
comment
и, пожалуйста, вставьте код его использования с карты Google. как вы называете этот класс, любая помощь будет оценена по достоинству. - person UMAR-MOBITSOLUTIONS; 16.04.2011
comment
Извините, это широта/долгота, на которые нажал пользователь. это глобальная переменная, которая содержит эти значения. Этот класс является внутренним классом моего MapActivity - person Aman Alam; 17.04.2011
comment
как вы называете это с карты Google? чтобы создать этот текущий элемент наложения, не могли бы вы также добавить этот код, чтобы я мог его использовать? - person UMAR-MOBITSOLUTIONS; 01.05.2011
comment
Пока вы добавляете наложение, используйте этот класс. и метод onDraw() всегда будет вызываться всякий раз, когда Android рисует фрагменты карты (при масштабировании, панорамировании и т. д.) - person Aman Alam; 01.05.2011
comment
@Sheikh Aman Привет, Шейх Аман. Я также хочу, чтобы этот тип круга означал в зависимости от расстояния, когда карта будет увеличиваться, тогда радиус круга также увеличится, а карта уменьшится, а затем снова уменьшится радиус круга. Теперь я могу нарисовать круг, но я не знаю, что делать для вышеуказанного запроса. - person Niranj Patel; 05.10.2011
comment
Вы должны быть в состоянии сделать это с помощью приведенного выше кода, так как это то, что я делал - person Aman Alam; 07.10.2011
comment
@SheikhAman спасибо, это работает .. но мне нужно сделать больше расчетов в соответствии с моим требованием, кстати, спасибо и хороший ответ ... - person Niranj Patel; 10.10.2011
comment
@SheikhAman Каков мой сценарий: я хочу реализовать эту вещь в своем приложении в Mapview, я подготовил пользовательскую галерею, в которой будут отображаться все миниатюры изображения или видео из галереи, когда я их выбираю. что я хочу сделать, так это то, что я хочу отобразить это изображение в моем представлении карты, я имею в виду, какие изображения, которые я когда-либо выбирал из галереи, изображают маленькие миниатюры вместо булавки, которую я хочу отобразить в представлении карты, как я могу это сделать, я не могу понять, пожалуйста, если у вас есть какая-либо ссылка... . - person Jay Thakkar; 19.09.2012
comment
Что импортировать, чтобы иметь возможность расширить Overlay? - person portfoliobuilder; 31.08.2016

Расширьте класс ItemizedOverlay, чтобы переопределить draw(). Canvas, где рисуются наложения, передается этому методу, и вы можете вызвать drawCircle или что-то, что необходимо для отображения вашего перетаскивателя диапазона.

person ognian    schedule 13.12.2010
comment
Это хороший вариант, но, как видно на изображении выше, мне нужны точки, где в данный момент находится маркер. сначала он даст мне геоточки, и мне нужно будет преобразовать их в формат экранных пикселей (координаты типа x, y) я ничего не могу за это! :-/ - person Aman Alam; 15.12.2010
comment
Проверьте это: code.google.com/android/add-ons/google-apis/reference/com/ - person ognian; 15.12.2010
comment
Круто .. я получил точки мыши. однако, поскольку я также использую метод onTap, чтобы поместить маркер в позицию, где пользователь щелкает, после переопределения метода draw() механизм onTap не работает. Потому что раньше он вызывал метод draw() по умолчанию для расстановки маркеров, который я сейчас переопределил. Любое решение этого!? - person Aman Alam; 17.12.2010

Пример кода для рисования канцелярской кнопки с кругом:

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;
}
}
person Monica M    schedule 18.02.2012
comment
HI manaco .. во время работы у меня есть некоторые сомнения в вашем коде. для функции масштабирования есть кнопка масштабирования или любая? - person NovusMobile; 20.02.2012
comment
@denny Я использовал элементы управления масштабированием в main.xml Перейдите по этой ссылке, чтобы узнать больше о карте ссылка - person Monica M; 21.02.2012