MapQuest Maps Android SDK

Shapes on the map

The MapQuest Maps SDK for Android provides two different ways to draw a polyline or polygon. You can simply add them on top of the map as annotations or as a more performant option as a layer within the map.

Annotations

Put a Polyline on the Map

Android with Map and Polyline
public class MainActivity extends Activity {
    private final LatLng CAMERA_LOC = new LatLng(39.745391, -105.00653);
    private MapView mMapView;
    private MapboxMap mMapboxMap;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        MapQuest.start(getApplicationContext());
        setContentView(R.layout.activity_main);

        mMapView = (MapView) findViewById(R.id.mapquestMapView);

        mMapView.onCreate(savedInstanceState);
        mMapView.getMapAsync(new OnMapReadyCallback() {
            @Override
            public void onMapReady(MapboxMap mapboxMap) {
                mMapboxMap = mapboxMap;
                mMapView.setStreetMode();
                mMapboxMap.moveCamera(CameraUpdateFactory.newLatLngZoom(CAMERA_LOC, 13));
                setPolyline(mapboxMap);
            }
        });
    }

    private void setPolyline(MapboxMap mapboxMap) {
        List<LatLng> coordinates = new ArrayList<>();
        coordinates.add(new LatLng(39.74335,-105.01234));
        coordinates.add(new LatLng(39.74667,-105.01135));
        coordinates.add(new LatLng(39.7468,-105.00709));
        coordinates.add(new LatLng(39.74391,-105.00794));
        coordinates.add(new LatLng(39.7425,-105.0047));
        coordinates.add(new LatLng(39.74634,-105.00478));
        coordinates.add(new LatLng(39.74734,-104.99984));

        PolylineOptions polyline = new PolylineOptions();
        polyline.addAll(coordinates);
        polyline.width(3);
        polyline.color(Color.BLUE);
        mapboxMap.addPolyline(polyline);
    }

Put a Polygon on the Map

Android with Map and Polygon
private void setPoygon(MapboxMap mapboxMap) {
    List<LatLng> coordinates = new ArrayList<>();
    coordinates.add(new LatLng(39.744465080845458,-105.02038957961648));
    coordinates.add(new LatLng(39.744460864711129,-105.01981090977684));
    coordinates.add(new LatLng(39.744379574636383,-105.01970518778262));
    coordinates.add(new LatLng(39.743502042120781,-105.01970874744497));
    coordinates.add(new LatLng(39.743419794549339,-105.01977839958302));
    coordinates.add(new LatLng(39.74341214360723,-105.02038412442006));
    coordinates.add(new LatLng(39.74349726029007,-105.02049233399056));
    coordinates.add(new LatLng(39.744393745651706,-105.0204836274754));

    PolygonOptions polygon = new PolygonOptions();
    polygon.addAll(coordinates);
    polygon.fillColor(Color.rgb(255, 102, 0));
    polygon.strokeColor(Color.BLACK);
    mapboxMap.addPolygon(polygon);
}

Layer Based Polylines and Polygons

While sources hold the data, layers are used to style and display the information. Several layer types are offered depending on your source geometry. Except for layers of the background type, each layer needs to refer to a source. You can optionally filter features and then define how those features are styled. Each layer offers a setProperties API which can be used to style the layer in many different ways. Note that instead of creating different layers depending on certain cases inside your source data, it's recommended to use data-driven styling to reduce the number of layers that the map needs to render.

routeCoordinates = new ArrayList<Point>();
routeCoordinates.add(Point.fromLngLat(-118.39439114221236, 33.397676454651766));
routeCoordinates.add(Point.fromLngLat(-118.39421054012902, 33.39769799454838));
...

// Create the LineString from the list of coordinates and then make a GeoJSON
// FeatureCollection so we can add the line to our map as a layer.
LineString lineString = LineString.fromLngLats(routeCoordinates);

FeatureCollection featureCollection =
  FeatureCollection.fromFeatures(new Feature[]{Feature.fromGeometry(lineString)});

Source geoJsonSource = new GeoJsonSource("line-source", featureCollection);

mapboxMap.addSource(geoJsonSource);

LineLayer lineLayer = new LineLayer("linelayer", "line-source");


// The layer properties for our line. This is where we make the line red, set its width, etc
lineLayer.setProperties(
  PropertyFactory.lineCap(Property.LINE_CAP_ROUND),
  PropertyFactory.lineJoin(Property.LINE_JOIN_ROUND),
  PropertyFactory.lineWidth(2f),
  PropertyFactory.lineColor(Color.parseColor("#f20b0d"))
);

mapboxMap.addLayer(lineLayer);