weightValueMapper property

Returns the values which determines the weight of each tile.

The quantitative value of the underlying data has to be returned from the weightValueMapper callback. Based on this value, every tile (rectangle) will have its size.

The data will be grouped based on the values returned from the TreemapLevel.groupMapper callback from the each TreemapLevel. Each unique value returned from the callback will have its own tile and its size will be based on the value returned in the weightValueMapper for the same index. If the same values returned for the multiple indices in TreemapLevel.groupMapper callback, it will be grouped, and its size will be the sum of values returned from weightValueMapper for those indices.

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;
        },
      levels: [
        TreemapLevel(
            color: Colors.red,
            padding: EdgeInsets.all(2),
            groupMapper: (int index) {
              return _socialMediaUsersData[index].country;
            }),
        ],
      ),
    );
  }

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

Implementation

SfTreemap class