How to draw a polyline on a google map with two different colors between two locations

I have two locations, and I need a two-sheeted polyline between these two locations, I finished drawing a polyline between these locations.

The problem is that the polyline has one color, but due to the requirement I have to draw a polyline of two different colors, as shown below: enter image description here

if anyone has any significant piece of code or some suggestion on this problem ... Thanks in advance

+5
source share
2 answers

Starting February 15, 2017, you can change the course line of the polyline. From the release note (my sheets)

This release introduces a custom style for polylines and contours of polygons and circles. Change the stroke pattern from the solid line (default) to choose dashes, dots, and spaces. In polylines and polygons you can specify the type of bevel or round joint to replace the fixed fixed seams installed by default, you can also change the cap at each end of the polyline from the butt (by default) to a square or round cover, or specify a custom raster map to be used as a cover. Modeling of stroke patterns, types of joints and caps of the beginning and the end is available in the full API, but not in the relief mode.

Please note that you will need to use Google Play Services 10.2 or higher. So in your build.gradle you will need to add:

 dependencies { compile 'com.google.android.gms:play-services-maps:10.2.0' } 

You can specify the stroke pattern of your polyline, but you cannot change the color, so you will need to draw a solid polyline and a dotted polypin on top of it to achieve the desired pattern (note that you will draw two polylines instead of one, and this can affect performance ):

 List<LatLng> latLngs = new ArrayList<>(); // Add all your LatLngs to the List // Draw a solid green polyline mMap.addPolyline(new PolylineOptions() .addAll(latLngs) .color(Color.GREEN)); // Draw a dashed (60px spaced) blue polyline List<PatternItem> dashedPattern = Arrays.asList(new Dash(60), new Gap(60)); mMap.addPolyline(new PolylineOptions() .addAll(latLngs) .pattern(dashedPattern) .color(Color.BLUE)); 

The result is as follows:

enter image description here

You can find more information about the new style polyline feature here .

+7
source
 Random rnd = new Random(); int color = Color.argb(255, rnd.nextInt(256), rnd.nextInt(256), rnd.nextInt(256)); 

--- loop for each lat lng and add ----

  mMap.addPolyline(new PolylineOptions() .add(new LatLng(lats, lons), new LatLng(late,lone)) .width(5) .color(color)); 

Change the color coding based on your requirements.

0
source

Source: https://habr.com/ru/post/1264832/


All Articles