Creating an Org Chart from a List

This guide walks through the steps required to create an organization chart from a SharePoint list using Team​OrgChart Starter Edition.

 

Creating the List

Creating the list to store the chart information

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

Add columns to your 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

Populate the list

Once the list structure has been created we fill in some example data.

 

Configuring the Chart

Access Settings

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

Change the source to list

In the General tab change the list from User Profiles to List.  Upon doing so additional configuration fields will be shown.

From:

  • 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

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.

The Completed Chart

How can we help?

CAPTCHA
This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.
Image CAPTCHA
Enter the characters shown in the image.

Our products

SharePointOrgChart

  • For Microsoft SharePoint
  • Download, install & configure
  • $750
 

TeamOrgChart

  • For Office 365 and SharePoint Online
  • Online, interactive service based application
 

OrgChartComponent

  • For ASP.NET websites and applications
  • Versatile & feature rich
  • $200 +