Android google maps Polygon add round hole

I am currently working on Google Maps.

and I need the following effect:

enter image description here

To do this, I began to create a polygon overlay all over the country, following the addition of a hole for this polygon for the selected area with a certain KM radius, so that it would compress and expand when zoomed.

Now I know how to create a polygon;

mMap.addPolygon(new PolygonOptions().addAll(sCountryBorder).fillColor(0xcc000000)); 

Now I want to add a hole to this polygon, but I do not know how to create a circular hole with the correct radius.

 mMap.addPolygon(new PolygonOptions().addAll(sCountryBorder).fillColor(0xcc000000).addHole({CIRCULAR_HOLE})); 

I know that you can create a circle with a certain radius in Google maps, is it possible to somehow convert it into an array of LatLng objects?

 mMap.addCircle(new CircleOptions() .center(newLocation) .radius(mRadius.size) .strokeWidth(0) .fillColor(getResources().getColor(R.color.transparant))); 
+5
source share
2 answers

Unfortunately, the Google Maps library does not allow you to get an array of LatLng circles. Therefore, you need to draw a circle yourself.

Basically, you need to provide a method that will create a hole (circle) for the polygon filling your map.

There are 3 steps.

Step 1 is to create a method that creates a polygon that spans the entire map.

 private static List<LatLng> createOuterBounds() { float delta = 0.01f; return new ArrayList<LatLng>() {{ add(new LatLng(90 - delta, -180 + delta)); add(new LatLng(0, -180 + delta)); add(new LatLng(-90 + delta, -180 + delta)); add(new LatLng(-90 + delta, 0)); add(new LatLng(-90 + delta, 180 - delta)); add(new LatLng(0, 180 - delta)); add(new LatLng(90 - delta, 180 - delta)); add(new LatLng(90 - delta, 0)); add(new LatLng(90 - delta, -180 + delta)); }}; } 

Step 2 is to create a method that returns Iterable with a LatLng circle.

 private static Iterable<LatLng> createHole(LatLng center, int radius) { int points = 50; // number of corners of inscribed polygon double radiusLatitude = Math.toDegrees(radius / (float) EARTH_RADIUS); double radiusLongitude = radiusLatitude / Math.cos(Math.toRadians(center.latitude)); List<LatLng> result = new ArrayList<>(points); double anglePerCircleRegion = 2 * Math.PI / points; for (int i = 0; i < points; i++) { double theta = i * anglePerCircleRegion; double latitude = center.latitude + (radiusLatitude * Math.sin(theta)); double longitude = center.longitude + (radiusLongitude * Math.cos(theta)); result.add(new LatLng(latitude, longitude)); } return result; } 

3, and the final step is to use these methods to create PolygonOptions .

 static PolygonOptions createPolygonWithCircle(Context context, LatLng center, int radius) { return new PolygonOptions() .fillColor(ContextCompat.getColor(context, R.color.grey_500_transparent)) .addAll(createOuterBounds()) .addHole(createHole(center, radius)) .strokeWidth(0); } 

I also created a demo repository that contains an application that draws the necessary circle. https://github.com/AntonyGolovin/Google-Map-mask . All the necessary logic is contained in the MapHelper.java class.

Result:

Screenshot

+4
source

I used this method to draw a circle with a radius of 5000 m from the user's location, but I don’t know how to get this nice highlighted effect in your demo version, this method gives you a circle with a light blue background and a blue stroke, I hope it helps!

 private void drawCircle(LatLng point){ // Instantiating CircleOptions to draw a circle around the marker CircleOptions circleOptions = new CircleOptions(); // Specifying the center of the circle circleOptions.center(point); // Radius of the circle circleOptions.radius(5000); // Border color of the circle circleOptions.strokeColor(0xFF0000FF); // Fill color of the circle circleOptions.fillColor(0x110000FF); // Border width of the circle circleOptions.strokeWidth(2); // Adding the circle to the GoogleMap mMap.addCircle(circleOptions); } 
-1
source

All Articles