Question

I currently need to display a boat/cruise ship route in a MapView, something like this

I started coding my version of it, but since every example that I see of water routes are the same I started wondering if there was a “standard” method of doing it. I have been searching for hours and haven’t found anything yet, so I decided to ask here.

Here’s what I have so far:

Point point2 = new Point();
projection.toPixels(gp2, point2);
paint.setStrokeWidth(5);
paint.setPathEffect(new DashPathEffect(new float[] {8,12}, 5));
paint.setAlpha(defaultColor==Color.parseColor("#6C8715")?200:100);
canvas.drawLine(point.x, point.y, point2.x,point2.y, paint);

It is working and the only thing left to do is adjust the line every time that the user zooms.
Is this the way to do it, or there’s a standard way of doing it?

Any help is appreciated, thank you.

Answer 1

If you move your code to an Overlay then you wouldn’t have to worry about adjusting the line when the user zooms/pans. Since you probably have more than two points to draw you can also take advantage of the Path class.

import com.google.android.maps.Overlay;

class PathOverlay extends Overlay {

    private void List<GeoPoint>geoPoints;

    public PathOverlay(List<GeoPoint> points) {
        this.geoPoints = geoPoints;
    }   

    public void draw(Canvas canvas, MapView mapView, boolean shadow) {
        super.draw(canvas, mapv, shadow);

        Paint paint = new Paint();
        paint.setStrokeWidth(5);
        paint.setPathEffect(new DashPathEffect(new float[] {8,12}, 5));
        paint.setAlpha(defaultColor==Color.parseColor("#6C8715")?200:100);

        Path path = new Path();
        boolean isFirst = true;
        for (GeoPoint geoPoint : this.geoPoints) {
            Point point = new Point();
            mapView.getProjection().toPixels(geoPoint, point);
            if (isFirst) {
                isFirst = false;
                path.moveTo(point.x, point.y);
            }
            else {
                path.lineTo(point.x,point.y);
            }
        }
        canvas.drawPath(path, paint);
    }
}