How to smooth out polyline directions on Android Google Maps API?

Question

I have polylines working for directions form two locations on Android Google Maps API, however, you can tell that the corners are jagged and not smooth. Are there any steps to take to smooth these lines out to appear more natural (like on google's own maps site)

Below is the class that is called with appropriate parameters to create the polylines

public class GetDirectionsData extends AsyncTask<Object, String, String> {

String googlePlacesData;
GoogleMap mMap;
String url;
LatLng latlng;


@Override
protected String doInBackground(Object... objects) {
    mMap = (GoogleMap)objects[0];
    url = (String)objects[1];
    latlng = (LatLng)objects[2];

    DownloadUrl downloadUrl = new DownloadUrl();
    try {
        googlePlacesData = downloadUrl.readUrl(url);
    } catch (IOException e) {
        e.printStackTrace();
    }

    return googlePlacesData;
}

@Override
protected void onPostExecute(String s){
    String[] directionsList;

    DataParser parser = new DataParser();
    directionsList = parser.parseDirections(s);
    displayDirections(directionsList);
}

public void displayDirections(String[] directionsList){
    int count = directionsList.length;
    for(int i = 0; i<count; i++){
        PolylineOptions options = new PolylineOptions();
        options.color(Color.rgb(0,179,253));
        options.width(15);
        options.addAll(PolyUtil.decode(directionsList[i]));
        mMap.addPolyline(options);
    }
}

I would look into changing the join type for your polyline. I am unfamiliar with the API, but here is a link I think you might find helpful. https://developers.google.com/android/reference/com/google/android/gms/maps/model/JointType — Keegan Teetaert, Apr 05 '18 at 01:48
@KeeganTeetaert that seems to be on the right track and I added 'options.JoinType(2)' and tried 'options.JoinType(JointType.Rounded)' however, neither changed anything — Jordan Farris, Apr 05 '18 at 02:20
Also look at the cap (default is "butt") but "square" ("squared off after extending half the stroke width beyond ") or "round". — , Apr 05 '18 at 11:47
Have you had a look at:: https://stackoverflow.com/questions/26508383/google-map-api-making-lines-smoother-when-bending/26508612#26508612 — Barns, Apr 05 '18 at 13:40

score 3 · Accepted Answer · answered Apr 05 '18 at 17:51

Add all directions as one polyline, not separate polyline for separate direction: use something like

public void displayDirections(String[] directionsList){
    PolylineOptions options = new PolylineOptions();
    options.color(Color.rgb(0,179,253));
    options.width(15);
    int count = directionsList.length;
    for(int i = 0; i<count; i++){
        options.addAll(PolyUtil.decode(directionsList[i]));
    }
    mMap.addPolyline(options);
}

instead of

public void displayDirections(String[] directionsList){
    int count = directionsList.length;
    for(int i = 0; i<count; i++){
        PolylineOptions options = new PolylineOptions();
        options.color(Color.rgb(0,179,253));
        options.width(15);
        options.addAll(PolyUtil.decode(directionsList[i]));
        mMap.addPolyline(options);
    }
}

because JointType affects points of polyline, not separate polylines.

How to smooth out polyline directions on Android Google Maps API?

1 Answers1