overflowMode property

TreemapLegendOverflowMode overflowMode
final

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 TreemapLegendOverflowMode.wrap for default legend and TreemapLegendOverflowMode.scroll for bar legend.

late List<SocialMediaUsers> _source;

@override
void initState() {
  _source = <SocialMediaUsers>[
    SocialMediaUsers('India', 'Facebook', 280),
    SocialMediaUsers('India', 'Instagram', 88),
    SocialMediaUsers('USA', 'Facebook', 190),
    SocialMediaUsers('USA', 'Instagram', 120),
    SocialMediaUsers('Japan', 'Twitter', 48),
    SocialMediaUsers('Japan', 'Instagram', 31),
  ];
  super.initState();
}

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: SfTreemap(
      dataCount: _source.length,
      weightValueMapper: (int index) {
        return _source[index].usersInMillions;
      },
      levels: [
        TreemapLevel(
          groupMapper: (int index) {
            return _source[index].country;
          },
        ),
      ],
      legend: TreemapLegend(
        overflowMode: TreemapLegendOverflowMode.scroll,
      ),
    ),
  );
}

class SocialMediaUsers {
  const SocialMediaUsers(
    this.country,
    this.socialMedia,
    this.usersInMillions,
  );
  final String country;
  final String socialMedia;
  final double usersInMillions;
}

See also:

  • position, to set the position of the legend.
  • direction, to set the direction of the legend.

Implementation

final TreemapLegendOverflowMode overflowMode;