American University of Beirut

Organization Chart

​​​The organization chart web part displays the hierarchy of an organization with the ability to specify an image for each person and with zooming and panning capability.

The below steps describe adding/configuring the org chart web part:

  1. ​To create the backend:
    • ​​Open your site
    • ​​​Select "Site Contents"
    • Click "Add an app"
    • Select "Org Chart" from the templates
    • A popup window will show asking about the name of the new library, type "OrgChart"
    • From the lists settings delete the column "Reports To" (we need to re-add it)
    • Then from the list settings  click "Create column"
    • In the column name specify "ReportsTo" and select "Lookup" for the type of column, and for "Get information from" select the list you created.

  2. The web part properties include the below that you can change:
    1. ​​Web Url: This is the relative path to the site where you created the backend (by default the current site is specified and typically you dont need to change it)
    2. List Name: This is the internal name of the backend you created, typically you dont need to change this too if you used the name "OrgChart" when you created the backend.
    3. Initial Zoom: this is a value to specify if to have the chart zoomed-in or out. By default its set to 1 which means no zooming.
    4. Visible Level: By default after 3 levels the chart nodes are collapsed with a plus sign to expand, you can change than if needed.
    5. Vertical Level: By default the child nodes are displayed horizontally under the parent node, however you can control after what level the chidren are displayed vertically under the parent, this is useful if you have a large chart. By default this is set to 3.
    6. Allow Default Profile Picture: In the backend you can set a profile picture for each person, if this property is enabled then a default picture is displayed for the people with no profile picture set in the backend, if its disabled then no image is shown.
    7. Center Chart: Specify if the chart is centered around the root node, its enabled by default.


Contact Us

For various questions, please try contacting us via social media first!
read more

Privacy Statement

We take data privacy seriously and adhere to all applicable data privacy laws and regulations.
read more

Copyright and Disclaimer

Written permission is needed to copy or disseminate all or part of the materials on the AUB website.
read more

Title IX, Non-Discrimination, and Anti-Discriminatory Harassment

AUB is committed to providing a safe and respectful environment to all members of its community.
read more