Tree

Tree charts or maps are primarily used to display data that is grouped and nested in a hierarchical (or tree-based) structure.

The Method To Use

The method is s.plt.tree()

It must contain the following input variables:

order: int
data: Union[str, Dict, List[Dict]]

And accepts the following input variable as optional:

radial: bool 
vertical: bool
title: Optional[str]
padding: Optional[List[int]]
rows_size: Optional[int] 
cols_size: Optional[int]
option_modifications: Optional[Dict]

Video demonstration of the tree chart

https://api.media.atlassian.com/file/5d85a6be-75d8-4177-b918-9ea1aea8aaa0/artifact/video_1280.mp4/binary?client=acb7ab48-9de5-4698-bc3e-5e7ecb6bc0a7&collection=contentId-455508047&max-age=2592000&token=eyJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJhY2I3YWI0OC05ZGU1LTQ2OTgtYmMzZS01ZTdlY2I2YmMwYTciLCJhY2Nlc3MiOnsidXJuOmZpbGVzdG9yZTpjb2xsZWN0aW9uOmNvbnRlbnRJZC00NTU1MDgwNDciOlsicmVhZCJdfSwiZXhwIjoxNjQ3NDM0MDQ5LCJuYmYiOjE2NDc0MzExMDl9.EbohtJ4cAJo74H8bk6kEpWW6xU8FU3fGepiKf829csYapi.media.atlassian.com

Tree chart settings and usage.

Examples

1. Default Configuration

data = [{
    'name': 'root',
    'value': 35,
    'children': [
        {
            'name': 'Child A',
            'value': 9,
            'children': [
                {'name': 'Child A1', 'value': 23},
                {'name': 'Child A2', 'value': 72},
                {'name': 'Child A3', 'value': 93},
            ],
        },
        {
            'name': 'Child B',
            'value': 56,
            'children': [
                {'name': 'Child B1', 'value': 39},
                {'name': 'Child B2', 'value': 61},
                {'name': 'Child B3', 'value': 71},
            ],
        },
        {
            'name': 'Child C',
            'value': 100,
            'children': [
                {'name': 'Child C1', 'value': 19},
                {'name': 'Child C2', 'value': 66},
                {'name': 'Child C3', 'value': 47},
            ],
        },
    ],
}]

s.plt.tree(
    data=data, order=0
)

The tree chart is in the default configuration.

2. Customization And Context

data = [{
    'name': 'Central Plant',
    'value': 300,
    'children': [
         {
            'name': 'Mach A',
            'value': 100,
            'children': [
                 {'name': 'Working', 'value': 95},
                 {'name': 'Maintenance', 'value': 5},
            ],
        },
        {
            'name': 'Mach B',
            'value': 150,
            'children': [
                 {'name': 'Working', 'value': 135},
                 {'name': 'Maintenance', 'value': 15},
            ],
        },
        {
            'name': 'Mach C',
            'value': 50,
            'children': [
                {'name': 'Working', 'value': 40},
                {'name': 'Maintenance', 'value': 10},
            ],
        },
    ],
}]

s.plt.tree(
    data=data, order=0,
    title='Status of Machines at Central Plant',
    rows_size=2, cols_size=10, padding='0,0,0,2',
)

The tree chart fully customized, note the space before the component using padding='0,0,0,2', and cols_size=10.

Featured Content

Changing the Menu Path The menu_path can be modified.

Using the Grid

It is possible to use any number of rows.