CODEWITHSUNDEEP
fluttersyncfusionfluttermap
Lukas S
Lukas S

Reputation: 23

Is there a simple way of applying blur to shapes in syncfusion_flutter_maps?

So I am using syncfusion_flutter_maps for a simple map app and I want certain areas on the map to be darkened and blurred out. I figured quite quickly how to do the darkening part with something as simple as this:

              sublayers: [
                MapCircleLayer(
                  circles: {
                    MapCircle(
                      center: MapLatLng(
                          _userLocation.latitude, _userLocation.longitude),
                      radius: 50,
                    ),
                  },
                  color: Colors.black.withOpacity(0.3),
                  strokeColor: Colors.red,
                  strokeWidth: 0,
                ),
              ],

but how do I add blur to it?

Trying to add something like BackDropFilter doesnt seem very practical to me vut I couldnt find much about this, despite how well documented this package is.

Alternatively I would be willing to settle for overlaying it with custom image instead.

Upvotes: 0

Views: 101

Answers (1)

Lavanya A
Lavanya A

Reputation: 26

The requirement can be achieved by using the MapCircleLayer.inverted property, and its used to highlight a specific area on a map to make it more readable by using the circles property of MapCircleLayer.inverted by adding mask to the outer region of the highlighted circles.

Check here to know more about the inverted polygon.

Upvotes: 0

Related Questions