Creating an Org Chart from a List
This guide walks through the steps required to create an organization chart from a SharePoint list using TeamOrgChart Starter Edition.
Creating the List
To create an organization chart from a list you will need to create a list within your SharePoint tenant.
To do this select the "Custom List" app from the "Add An App" page on your SharePoint tenant. See this Microsoft guide for more information on creating custom lists.
In this example we create a list called OrgChart.
Add Columns to the List
The list can contain any number or type of columns but it must contain one column that contains a value that uniquely identifies the person in the list and one column that uniquely defines that person's manager.
In this example we add columns called:
- Name - containing the person's name.
- Email - containing the persons email. This column will be used to uniquely identify the person.
- ManagerEmail - containing the managers email. This column will be used to identify the persons manager.
Populate the List
Once the list structure has been created we fill in some example data.
Configuring the Chart
Once the list has been created we are ready to configure TeamOrgChart Starter Edition.
Access TeamOrgChart Starter from Site Contents. It will initially show the organisation chart drawn from the User Profile Service and starting from the current user.
Open the Settings panel by clicking on Settings on the right hand-side of the menu bar.
Select the List Data Source
In the General tab change the list from User Profiles to List. Upon doing so additional configuration fields will be shown.
- Available Lists - choose the list that contains the org chart data ( in our example it is called "OrgChart" )
- Primary Key - choose the column that uniquely identifes a person in the list ( in our example this is "email" )
- Manager Column - choose the column that uniquely identifies the persons manager ( in our example this is "Manager Email" )
- Picture Column - choose a column that contains a picture or hyperlink pointing to the persons picture.
Style the Chart
The final stage is to style the chart using the Appearance tab.
Within in Appearance you can select the box color, size and contents.
You will also need to pick the fields that will be displayed within the chart boxes.
Once you have styled the chart exit the settings panel by clicking on the close icon at the top of the panel or anywhere within the main chart area.