layoutDirection property
Represents the layout direction of the tiles.
- The TreemapLayoutDirection.topLeft will layout the tiles from top-left to bottom-right of the rectangle.
- The TreemapLayoutDirection.topRight will layout the tiles from top-right to bottom-left of the rectangle.
- The TreemapLayoutDirection.bottomLeft will start layout the tiles from bottom-left to top-right of the rectangle.
- The TreemapLayoutDirection.bottomRight will start layout the tiles from bottom-right to top-left of the rectangle.
Defaults to TreemapLayoutDirection.topLeft.
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;
},
layoutDirection: TreemapLayoutDirection.topRight,
levels: [
TreemapLevel(
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;
}
See also:
- The weightValueMapper, determines the weight of each tile.
Implementation
final TreemapLayoutDirection layoutDirection;