An organization chart visually displays the hierarchical structure and departmental relationships within an organization. It uses nodes and edges to represent different positions, departments, and their reporting relationships. Each node represents a position or department, while edges represent reporting or peer relationships. Presented in a tree structure, the top level is the highest management, expanding downward level by level to individual departments and positions.
Alice Johnson is the company's Chief Technology Officer. Her team includes Senior Software Engineer Bob Smith and IT Support Department Head Eve Black. Bob Smith leads the software engineering team, with team members including Software Engineers Charlie Brown and Diana White. Eve Black heads the IT Support department, with team members including IT Support Specialists Frank Green and Grace Blue.
Visualize the following data using an organization chart: Eric Joplin is the Chief Executive Officer, with Linda Newland (Chief Executive Assistant) as a direct report.
Display a tech company's department structure using an organization chart: CEO has three executives — CTO, CFO, and COO. The CTO oversees the Front-End Team and Back-End Team.
| Property | Type | Required | Description |
|---|---|---|---|
| type | string | required | Value must be "organization-chart". |
| data | Object | required | Tree data, root node containing name, description, and children fields. |
| data.name | string | required | Node name (position or department), must be unique. |
| data.description | string | optional | Node description, e.g. position responsibilities or department overview. |
| data.children | Object[] | optional | Child node array, representing subordinate positions or departments. |
| title | string | optional | Chart title. |
| theme | 'default' | 'dark' | 'academy' | optional | Chart theme, default is "default". |
