enableDrilldown property

bool enableDrilldown

Specifies whether this treemap is complex enough (having larger data) to enable drilldown.

If enabled, only one level is visible in the UI at a time. While tapping a particular tile, it is expanded to the viewport size and loads its descendant tiles with smoother animation.

At the same time TreemapBreadcrumbs.builder is called with the tapped tile details.

The TreemapBreadcrumbs.builder will return a widget which will be added in breadcrumbs item.

Selection for touch and mouse enabled devices, and tooltip for touch devices will work only for the tiles which don’t have descendants.

late List<SocialMediaUsers> _socialMediaUsersData;

@override
void initState() {
   _socialMediaUsersData = <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: _socialMediaUsersData.length,
        weightValueMapper: (int index) {
          return _socialMediaUsersData[index].usersInMillions;
        },
        enableDrilldown: true,
        breadcrumbs: TreemapBreadcrumbs(
          builder:
          (BuildContext context, TreemapTile tile, bool isCurrent) {
            return Text(tile.group);
          },
        ),
        levels: [
          TreemapLevel(
            groupMapper: (int index) {
              return _socialMediaUsersData[index].country;
            },
            labelBuilder: (BuildContext context, TreemapTile tile) {
              return Text(tile.group);
            },
          ),
          TreemapLevel(
            groupMapper: (int index) {
              return _socialMediaUsersData[index].socialMedia;
            },
            labelBuilder: (BuildContext context, TreemapTile tile) {
              return Text(tile.group);
            },
          ),
        ],
      ),
    );
  }

See also:

• The breadcrumbs, for return back to the previous levels.

Implementation

final bool enableDrilldown;