Sometimes in SharePoint we need to visualize hierarchical data as organizational chart. Prerequisites: not to use Flash or Silverlight technologies here.
So, in our scenario for storage of organization structure will be used SharePoint List based on Custom List , for rendering engine Google Chart Tools.
Implementation
First, let’s take a look at list’s schema for storing organizational structure
| Name | Type | Description |
|---|---|---|
| ParentOrgElement | Lookup | Used for parent/child relationship |
| OrgDescription | Note | Display text for chart box |
| OrgAdditionalProperties | Note | Visual behavior for chart box |
From Google Charts library we’ll use Organizational Chart package only.
1. Google Charts Tools loading and package initialization
2. Fetch data using SharePoint Web Service from list that contains organizational structure
3. Bind data source and draw chart
Usage
Result page with Org Structure rendered as Chart in List View
