Treemaps are used to display hierarchical data. The information is displayed as a cluster of rectangles varying in size and color, depending on their data value. The size of each rectangle represents a quantity, while the color can represent a number value or a category.
The method to use
The method is shimoku.plt.treemap()
It must contain the following input variables:
data: Union[str, DataFrame, List[Dict]]
menu_path:str
order:int
And can be personalized with the input variable:
filters: Optional[List[str]]
rows_size: Optional[int]
cols_size: Optional[int]
padding: Optional[List[int]]
Video demonstration of the treemap chart
Treemap chart settings and usage.
Examples
1. Default configuration
data_ =[{
'name':'root',
'value':500,
'children':[
{
'name':'Child A',
'value':150,
'children':[
{'name':'Child A1','value':100},
{'name':'Child A2','value':30},
{'name':'Child A3','value':20},
],
},
{
'name':'Child B',
'value':250,
'children':[
{'name':'Child B1','value':150},
{'name':'Child B2','value':70},
{'name':'Child B3','value':30},
],
},
{
'name':'Child C',
'value':100,
'children':[
{'name':'Child C1','value':70},
{'name':'Child C2','value':20},
{'name':'Child C3','value':10},
],
},
],
}]
​
shimoku.plt.treemap(
data=data_,
menu_path='test/treemap-1',
order=0,
rows_size=2, cols_size=12,
)
The result is:
The treemap chart is in the default configuration.
The chart has tooltips, showed when you hover the mouse over the figure. The area of each rectangle is proportional to that number.
2. Title for the chart, changing data, size and padding
​
data_ =[{
'name':'WebStore',
'value':500,
'children':[
{
'name':'Info Tech',
'value':150,
'children':[
{'name':'tablets','value':100},
{'name':'laptops','value':30},
{'name':'printers','value':20},
],
},
{
'name':'Electronics',
'value':250,
'children':[
{'name':'Camera','value':150},
{'name':'Cell Phone','value':70},
{'name':'GPS','value':30},
],
},
{
'name':'Heating',
'value':100,
'children':[
{'name':'Temp Control','value':70},
{'name':'Filters','value':20},
{'name':'Sensors','value':10},
],
},
],
}]
​
shimoku.plt.treemap(
data=data_,
menu_path='test/treemap-2',
order=0,
rows_size=2, cols_size=10,
padding='0,0,0,2',
title='Total Sales by Department - Webstore',
)
The result is:
Hovering over the chart one can see, for instance, the number of sales of tablets (100).