Web Implementation Guidelines Group Component Builder Information (v3+)

Org Chart

Create a visual organization chart that clearly communicates reporting relationships and team structure.

Choose Alternate Versions

Back to the builder

Component Notes for Latest Version

Overview

This component renders an organization chart based on simple JSON of the organization's
entities. The only required data is the title and parent for each entity. Here's a
minimal example:

{
    "title": "Vice Chancellor for Student Affairs",
    "children": [
        {
            "title": "Administrative Assistant"
        },
        {
            "title": "Associate Vice Chancellor for Student Success and Engagement",
            "children": [
                { "title": "Director, Illinois Leadership Center" },
                { "title": "Director, Minority Student Affairs" }
            ]
        }
    ]
}

The component renders an org chart to fit into a given space, laying it out automatically
to make it fit as well as possible.

Code Examples

<ilw-org-chart></ilw-org-chart>

Accessibility Notes and Use

Nothing yet.

Web Implementation Guidelines Group Component Builder Information (v3+)
Create an issue with the new toolkit builder