onTap property

Callback to receive tap event for this polygon.

You can customize the appearance of the tapped polygon based on the index passed on it as shown in the below code snippet.

 late MapZoomPanBehavior _zoomPanBehavior;
 late List<MapLatLng> _polygon;
 late MapShapeSource _mapSource;
 int _selectedIndex = -1;

 @override
 void initState() {
   _polygon = <MapLatLng>[
     MapLatLng(38.8026, -116.4194),
     MapLatLng(46.8797, -110.3626),
     MapLatLng(41.8780, -93.0977),
   ];

   _mapSource = MapShapeSource.asset(
     'assets/usa.json',
     shapeDataField: 'name',
   );

   _zoomPanBehavior = MapZoomPanBehavior();
   super.initState();
 }

 @override
 Widget build(BuildContext context) {
   return Scaffold(
     appBar: AppBar(title: Text('Polygon shape')),
     body: SfMaps(layers: [
       MapShapeLayer(
         source: _mapSource,
         sublayers: [
           MapPolygonLayer(
             polygons: List<MapPolygon>.generate(
               1,
               (int index) {
                 return MapPolygon(
                   points: _polygon,
                   color: _selectedIndex == index
                     ? Colors.blue
                     : Colors.red,
                   onTap: () {
                     setState(() {
                       _selectedIndex = index;
                     });
                   },
                 );
               },
             ).toSet(),
           ),
         ],
         zoomPanBehavior: _zoomPanBehavior,
       ),
     ]),
   );
 }

Implementation

MapPolygon class