Develop Reference

How to draw polylines from Google Directions Api

I'm trying to draw a polyline from what the Google Directions Api returns, the api has this field, overview_polyline, I'm assuming that this field contains the entire polyline so I was thinking why not draw the polyline from there, this is what I have in my JSON, from Google:
{
geocoded_waypoints: [
{},
{}
],
routes: [
{
bounds: {},
copyrights: "Dados do mapa ©2017 Google, Inst. Geogr. Nacional",
legs: [],
overview_polyline: {
points: "cxwnFtdct#dAQlAf#fAf#|Aq#l#]pCcFhCjA|LfJlAT~#IpDi#jAb#f#HXi#t#kBhBeBx#Qz#z#dClHzFpW`H|RvTpj#`AxAdBdAnAXhB?fBk#rAcAnG_HhCgAjAKrATbA`Al#lBHnAc#rFgBhIkCxMBfIlBvHnBtCnB|AnEdCrJxFj#fB#h#OhAgCtHGfCl#jAlA\jE]tDBzBb#tLxFtK~E`d#hShIzEtDhDxDrEfDpFlFjNvDtRdDjThF`TzH`QhEhG|EvFhL`JpJtE|LpEdOpFjOzGlPfJlHzE~NjLfQvPfP|RtHrKxDjGfI|NdHbOvGjPfCbHpCtIvJh_#vG|[|CtNvFvSvE~MfI|QzLbTfNxQbKlKrRzP|NnNvNlQjIzMnLfV`T|h#nDbHhIdMxFjH~JrMnEfHzIrQfHvOtEjI|MnQfNzP`FzI~EnLrKp[nDlHvErHzL~MbRbM`EjCjFxEtRnX|D~EjIhI~WrRxGlGdFnG`JjNxHzKfTxVfKfRfMbRlErHtBlFxIjYvHnPpBtFxF~WpCjHjGhJfDzClF~CnDlArDl#pC\vHXvX[lOaB|GcBdFqBxQwJbDmAxE_ApJ_#jEXtItBrQ~EbQbDlUfBpMfA|IxCbF`DhGlGnJjKtJrF`SpFbRnDdUxAbGrAlEjBnFpDtNnMfGlE~[lTbRdQjTpUxH`GjHfEnGlC`O|DrUxEnEzAfFrBnSpIjPnDxSlAf\lAl~#hDzRrAjOpBvKrBrQtEv^pM``#rPrR|JxSdMlGnGfGtH~HxFdFlBtGfApGp#bG|AnHxD|FzFrH`L~FvH|HrFrFtBtFjA~Mt#pHR|FhA`IfDpEbDzFxGrHrKhEtErF`EnS`MzMvItSdUfF~DtE~B|SrInEnBzDtCxN`QpQfVtQ~Yjn#~fAnK`RvLlRzEjF|GlFrc#vUfRjKfIvGxDhEjIxKdN~T`L~MrFvE~LhIlp#fb#xCtBzFtFbEzFbDrGhH`TfF|JnGfHzEdD|UdIpTdHtKtFj]nUrEzC~[pTfLfG|EbB~KfCnTvDpmAxSzs#~LhOfDzOdFfOxGdY`O`k#zYnVzMlK|HrFjFbXj[rCbCvDfB|FfBbD^xRBlb#nBrIdArJvDfD|B|FzFvFzHnCbIDrCk#dA_A_#q#mHz#sAvAJ^f#r#n#x#UR_#fBGjET`S~#ro#pCpXpAfFp#dEhCnGtE#HXl#n#H^W|ASpShAbZxAtPp#~SjAzGZKdDStBd#x#dC#nEVz#HtAp#b#\OZ|AbBxDnFJf#"
},
summary: "A1",
warnings: [ ],
waypoint_order: [ ]
}
],
status: "OK"
}
How do I draw with that value?

This help me,you can use it..
Firstly create a google server key from google developer account
GoogleDirection.withServerKey(getResources().getString(R.string.SERVER_KEY))
.from(SourceLatlng)
.to(DestinationLatlng)
.execute(new DirectionCallback() {
#Override
public void onDirectionSuccess(Direction direction, String message) {
if (direction.isOK()) {
routeSucess2(direction, message,SourceLatlng,DestinationLatlng);
} else {
//selectedRawLine = ERROR;
}
}
#Override
public void onDirectionFailure(Throwable t) {
t.printStackTrace();
}
});
then draw a route using google direction
private void routeSucess2(Direction direction, String message,LatLng sourceLatlng,LatLng DestinationLng) {
for (Route route : direction.getRouteList()) {
PolylineOptions polyoptions = new PolylineOptions();
polyoptions.color(getResources().getColor(R.color.primary__dark));
polyoptions.width(5);
polyoptions.addAll(route.getOverviewPolyline().getPointList());
poly = googleMap.addPolyline(polyoptions);
poly.setClickable(true);
}
LatLngBounds.Builder latLngBuilder = new LatLngBounds.Builder();
if(sourceLatlng!=null)
latLngBuilder.include(sourceLatlng);
if(DestinationLng!=null)
latLngBuilder.include(DestinationLng);
try {
LatLngBounds bounds = latLngBuilder.build();
CameraUpdate cu = CameraUpdateFactory.newLatLngBounds(bounds,
UiHelper.dpToPixel(getActivity(), 135));
googleMap.animateCamera(cu);
} catch (Exception e) {
e.printStackTrace();
}
}
This would help you.

#alb First you should parse lat,long from JSON. You can see this link:
https://developers.google.com/maps/documentation/directions/
Then you have to get lat, long values & put them in List<>.
After that you can use below code for draw polyline on map:
PolylineOptions options = new PolylineOptions().width(5).color(Color.BLUE).geodesic(true);
for (int z = 0; z < list.size(); z++) {
LatLng point = list.get(z);
options.add(point);
}
line = myMap.addPolyline(options);

I already have replied on similar question on below link
How to buffer a polyline in Android or draw a polygon around a polyline?
It will resolve your Issue probably

receiving ambiguous sky screen while loading google map

while loading google map on device i am receiving below screen sometimes.it comes on second load as shown below. otherwise it comes perfectly as normal google map with route I am using SupportmapFragment and get googleMap object as.
supportMapFragment = (SupportMapFragment) getChildFragmentManager().findFragmentById(R.id.map_view_fragment);
below is code for displaying map in activity/fragment
public static void drawRouteIntoMap(final List<? extends MapHelper> position, final GoogleMap googleMap) {
/*List<MapHelper> position = new ArrayList<MapHelper>();
for (int i = lastPosition; i < maps.size(); i++) {
position.add(maps.get(i));
}*/
final LatLngBounds.Builder mapBounds = new LatLngBounds.Builder();
if (position.size() > 0 && Validator.isNotNull(googleMap)) {
googleMap.clear();
List<PolylineOptions> polylineOptionses = new ArrayList<PolylineOptions>();
PolylineOptions option = null;
Boolean lastPause = null;
for (MapHelper map : position) {
if (map.isPause()) {
if (Validator.isNull(lastPause) || !lastPause) {
option = new PolylineOptions().width(5).color(Color.rgb(255, 0, 155)).geodesic(true);
polylineOptionses.add(option);
}
mapBounds.include(new LatLng(map.getLatitude(),map.getLongitude()));
option.add(new LatLng(map.getLatitude(), map.getLongitude()));
} else {
if (Validator.isNull(lastPause) || lastPause) {
option = new PolylineOptions().width(5).color(Color.rgb(0, 179, 253)).geodesic(true);
polylineOptionses.add(option);
}
mapBounds.include(new LatLng(map.getLatitude(),map.getLongitude()));
option.add(new LatLng(map.getLatitude(), map.getLongitude()));
}
lastPause = map.isPause();
}
for (PolylineOptions options : polylineOptionses) {
googleMap.addPolyline(options);
}
if(Validator.isNotNull(option)){
//List<LatLng> points = option.getPoints();
googleMap.setOnMapLoadedCallback(new GoogleMap.OnMapLoadedCallback() {
#Override
public void onMapLoaded() {
LatLng startPoint = new LatLng(position.get(0).getLatitude(), position.get(0).getLongitude());
googleMap.addMarker(new MarkerOptions().position(startPoint).title("start").icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_GREEN)));
mapBounds.include(startPoint);
LatLng endPoint = new LatLng(position.get(position.size() - 1).getLatitude(), position.get(position.size() - 1).getLongitude());
mapBounds.include(endPoint);
googleMap.addMarker(new MarkerOptions().position(endPoint).title("finish").icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_RED)));
googleMap.setPadding(15, 205, 10, 110);
googleMap.moveCamera(CameraUpdateFactory.newLatLngBounds(mapBounds.build(), 0));
//googleMap.animateCamera(CameraUpdateFactory.newLatLngBounds(mapBounds.build(), 10));
googleMap.moveCamera(CameraUpdateFactory.zoomOut());
}
});
}
}
}
supportMapFragment.getMapAsync(new OnMapReadyCallback() {
#Override
public void onMapReady(GoogleMap googleMap) {
if (Validator.isNotNull(googleMap)) {
googleMap.setMyLocationEnabled(false);
googleMap.clear();
googleMap.setOnMapClickListener(new GoogleMap.OnMapClickListener() {
#Override
public void onMapClick(LatLng latLng) {
if (activity.preferences.isSaveScreen()) {
facebook.setChecked(false);
twitter.setChecked(false);
activity.replaceFragment(new FullMapFragment(), null);
}
if (!activity.preferences.isSaveScreen()) {
activity.preferences.setHistoryScreen(true);
activity.replaceFragment(new FullMapFragment(), null);
}
}
});
if (gps) {
nonGpsSummary.setVisibility(View.GONE);
List<HistoryMap> historyMaps = new ArrayList<HistoryMap>();
if (Validator.isNotNull(activity.preferences.getUserHistory().getHistoryMaps())) {
historyMaps.addAll(Arrays.asList(activity.preferences.getUserHistory().getHistoryMaps()));
}
if (historyMaps.size() > 0) {
if (Validator.isNotNull(googleMap)) {
drawRouteIntoMap(historyMaps, googleMap);
}
} else {
mapFrame.setVisibility(View.GONE);
}
} else {
gpsSummary.setVisibility(View.GONE);
}
}
}
});
this question is in relation with zoom over specific route google map.
by using that i get proper route with mapbounds but i m not getting why this screen is displaying.
i am not receiving cordinates 0.0 i debug that,api key is also proper.

You are calling moveCamera twice. The first one tries to move the camera but the second one doesn't wait for the first one to end and performs the zoom out.
This may not happen all the times and may behave differently on different devices.
The best option is to set a padding on your CameraUpdateFactory.newLatLngBounds(mapBounds.build(), 0) instead of 0

This problem occurs when your coordinates are not properly set. Make sure the coordinates that you are using is pointing in the land to get the maps correctly. Another possible reason is your API key is not working, try to generate new API key for this project.
For more information, check these related SO questions.
Android google maps return error and blue screen
Blue screen in Android Google Maps

TileOverlay with android and google maps

I've used MapTiler to create some tiles that I'm trying to overlay onto a Google map with android and not having much luck. The Android documentation is pretty sparse on this topic but I've done what I think should work, yet I'm not seeing the tiles when I zoom in to the correct level. I'm trying to make the overlay happen in the onMapReady() callback, should I be doing that somewhere else?
Here's the code I have for the onMapReady method:
#Override
public void onMapReady(GoogleMap googleMap) {
googleMap.setMapType(GoogleMap.MAP_TYPE_SATELLITE);
googleMap.setMyLocationEnabled(true);
CameraPosition cameraPosition = new CameraPosition.Builder().target(new LatLng(44.481705,-114.9378269)).zoom(16).build();
googleMap.animateCamera(CameraUpdateFactory.newCameraPosition(cameraPosition));
mTileOverlay = googleMap.addTileOverlay(new TileOverlayOptions()
.tileProvider((new UrlTileProvider(256, 256) {
#Override
public URL getTileUrl(int x, int y, int zoom) {
String s = "http://www.example.com/tiles/"+zoom+"/"+x+"/"+y+".png";
// added this logging to see what the url is
Log.d("home", s);
try {
return new URL(s);
} catch (MalformedURLException e) {
throw new AssertionError(e);
}
}
})));
}
any ideas here?
TIA
EDIT: I've adding some logging to see what 's' (my url) is returning, and it's returning the correct url and my server is serving up the tiles correctly from that url but still not seeing anything on the map in android.

It turns out I had a toast in my getTileUrl() method that was preventing the images from being returned. When I removed that, the tiles were served correctly.

How to draw polyline similar to google map app in android?

The polyline which we will draw on the map is not similar to the polyline of google's map application.It is giving a nice 3d feel,can we draw the polyline similar to that polyline?.Is it possible to draw using 9-patch images?.Anyone please help?.

Hello this would help you, it helped me.
Firstly make the google api server key from Google developer account then add a dependency for google direction.
compile 'com.akexorcist:googledirectionlibrary:1.0.4'
then it check that feasible and shortest route between LatLongs.
use this code to check route is available or not.
GoogleDirection.withServerKey(getResources().getString(R.string.SERVER_KEY))
.from(SourceLatlng)
.to(DestinationLatlng)
.execute(new DirectionCallback() {
#Override
public void onDirectionSuccess(Direction direction, String message) {
if (direction.isOK()) {
DrawRoute(direction, message,SourceLatlng,DestinationLatlng);
} else {
//selectedRawLine = ERROR;
}
}
#Override
public void onDirectionFailure(Throwable t) {
t.printStackTrace();
}
});
Using this we can find that route is feasible or not
private void DrawRoute(Direction direction, String message,LatLng sourceLatlng,LatLng DestinationLng) {
for (Route route : direction.getRouteList()) {
PolylineOptions polyoptions = new PolylineOptions();
polyoptions.color(getResources().getColor(R.color.blackcolor));
polyoptions.width(5);
polyoptions.addAll(route.getOverviewPolyline().getPointList());
poly = googleMap.addPolyline(polyoptions);
poly.setClickable(true);
}
LatLngBounds.Builder latLngBuilder = new LatLngBounds.Builder();
if(sourceLatlng!=null)
latLngBuilder.include(sourceLatlng);
if(DestinationLng!=null)
latLngBuilder.include(DestinationLng);
try {
LatLngBounds bounds = latLngBuilder.build();
CameraUpdate cu = CameraUpdateFactory.newLatLngBounds(bounds,
UiHelper.dpToPixel(getActivity(), 135));
googleMap.animateCamera(cu);
} catch (Exception e) {
e.printStackTrace();
}
}
Using this code we make polyline between two latLongs ...

Controlling markers Deployment.?

I am building an android app in which i have to do tracking of a user from one date/time to another and deploy makers using polylines one by one?
In response from a server i am receiving multiple lat/langs in a list. Now i want to deploy them one by one like a video is being played i know how to add markers i just want to control there deployment.E.g Marker A is deployed after 2 secs marker B should be deployed and joining with marker A with a poly-line and so do markers C,D. etc. How should i be able to achieve that. Timer, Threads? Any help or references,algos, would be great although i have searched such examples i couldn't find it yet.
Thanks in advance

You can use Handler to perform this task.
I am posting an example for you, I have not run it but I hope It will run successfully:
private final Handler mHandler = new Handler(Looper.getMainLooper());
private List<LatLng> mLatLngs;
private PutMarkerRunnable mRunnable;
private int mNoOfMarkersPlaced = -1;
private void showMarkers(List<LatLng> latLngs) {
mLatLngs = latLngs;
mHandler.post(mRunnable);
}
private class PutMarkerRunnable implements Runnable {
#Override
public void run() {
// write code to add marker
map.addMarker();
mNoOfMarkersPlaced++;
if (mNoOfMarkersPlaced != mLatLngs.size()) {
// scheduling next marker to be placed after 3 seconds
mHandler.postDelayed(mRunnable, 3000);
}
}
}

Ok thanks community.. But i have been finally able to do this through. Mark it correct because this really worked for me!
First we animate our camera using..
CameraPosition cameraPosition =
new CameraPosition.Builder()
.target(new LatLng(0,0))
.bearing(45)
.tilt(90)
.zoom(googleMap.getCameraPosition().zoom)
.build();
googleMap.animateCamera(
CameraUpdateFactory.newCameraPosition(cameraPosition),
ANIMATE_SPEEED_TURN,
new CancelableCallback() {
#Override
public void onFinish() {
}
#Override
public void onCancel() {
}
}
);/**
*
* Callback that highlights the current marker and keeps animating to the next marker, providing a "next marker" is still available.
* If we've reached the end-marker the animation stops.
*
*/
CancelableCallback simpleAnimationCancelableCallback =
new CancelableCallback(){
#Override
public void onCancel() {
}
#Override
public void onFinish() {
if(++currentPt < markers.size()){
CameraPosition cameraPosition =
new CameraPosition.Builder()
.target(targetLatLng)
.tilt(currentPt<markers.size()-1 ? 90 : 0)
//.bearing((float)heading)
.zoom(googleMap.getCameraPosition().zoom)
.build();
googleMap.animateCamera(
CameraUpdateFactory.newCameraPosition(cameraPosition),
3000,
simpleAnimationCancelableCallback);
highLightMarker(currentPt);
}
}
};
A bearing can be calculated between 2 android.location.Location objects. As we’re working with com.google.android.gms.maps.model.LatLng objects here, we first need to convert them into Location objects.
private Location convertLatLngToLocation(LatLng latLng) {
Location location = new Location("someLoc");
location.setLatitude(latLng.latitude);
location.setLongitude(latLng.longitude);
return location;
}
Once we have 2 Location objects, we can calculate the bearing between the 2. This is what we need to put on the Camera when transitioning to the target (the endLocation).
private float bearingBetweenLatLngs(LatLng beginLatLng,LatLng endLatLng) {
Location beginLocation = convertLatLngToLocation(beginLatLng);
Location endLocation = convertLatLngToLocation(endLatLng);
return beginLocation.bearingTo(endLocation);
}
We’ll use that number to calculate the coordinates of the intermediate point. Once we have those coordinates, we set our tracking marker to that new position.
long elapsed = SystemClock.uptimeMillis() - start;
double t = interpolator.getInterpolation((float)elapsed/ANIMATE_SPEEED);
double lat = t * endLatLng.latitude + (1-t) * beginLatLng.latitude;
double lng = t * endLatLng.longitude + (1-t) * beginLatLng.longitude;
LatLng intermediatePosition = new LatLng(lat, lng);
trackingMarker.setPosition(intermediatePosition);
We’ll also update our polyline with the new marker position, creating a trailing effect on the polyline.
private void updatePolyLine(LatLng latLng) {
List<LatLng> points = polyLine.getPoints();
points.add(latLng);
polyLine.setPoints(points);
}