overflowMode property

Wraps or scrolls the legend items when it overflows.

In wrap mode, overflowed items will be wrapped in a new row and will be positioned from the start.

If the legend position is left or right, scroll direction is vertical. If the legend position is top or bottom, scroll direction is horizontal.

Defaults to MapLegendOverflowMode.wrap for default legend and MapLegendOverflowMode.scroll for bar legend.

late List<DataModel> _data;
late MapShapeSource _mapSource;

 @override
 void initState() {
   super.initState();

   _data = <DataModel>[
     DataModel('India', 280, "Low"),
     DataModel('United States of America', 190, "High"),
     DataModel('Pakistan', 37, "Low"),
   ];

   _mapSource = MapShapeSource.asset(
     "assets/world_map.json",
     shapeDataField: "name",
     dataCount: _data.length,
     primaryValueMapper: (int index) {
       return _data[index].country;
     },
     shapeColorValueMapper: (int index) {
       return _data[index].storage;
     },
     shapeColorMappers: [
       MapColorMapper(value: "Low", color: Colors.red),
       MapColorMapper(value: "High", color: Colors.green)
     ],
   );
 }

 @override
 Widget build(BuildContext context) {
   return Scaffold(
     appBar: AppBar(
       title: Text('Default legend'),
     ),
     body: Center(
       child: SfMaps(
         layers: [
           MapShapeLayer(
             source: _mapSource,
             legend: MapLegend(
               MapElement.shape,
               overflowMode: MapLegendOverflowMode.scroll,
             ),
           )
         ],
       ),
     ),
   );
 }

class DataModel {
  const DataModel(this.country, this.count, this.storage);

  final String country;
  final double count;
  final String storage;
}

Implementation

MapLegend class