Getting started
Configuration wizard
- Open configuration wizard
- Data source
- Views and filtration
- Design
- Templates
- Custom code
- General
- Reset configuration
HTML templates
JavaScript framework
Additional resources
- Video: Introducing Plumsail Org Chart
- Data caching
- How Org Chart pulls data from AD On-Premises
- Exclude disabled users in On-Premises
- Make sure that SharePoint has enough data
- Configuring profiles sync in On-Premises
- Exporting properties to a directory service
General
- Version history
- Licensing details
- Data protection and security
- Custom code security measures
- Billing and subscription management
Printing & Reports
- Printing organizational structure
- Generate multi-page PDF report
- Export to CSV and analyze in Excel
- Custom styles for printed Org Chart
Microsoft Teams
Display different types of employees
- Display dotted-line managers (SharePoint list)
- Display dotted-line managers (Entra ID)
- Display dotted-line managers (User Profiles)
- Display dotted-line managers (Excel/CSV)
- Display assistants (SharePoint list)
- Display assistants (Entra ID)
- Display assistants (User Profiles)
- Display assistants (Excel/CSV)
- Display vacancies
Filter and order boxes
Customize boxes and styles
- Format boxes conditionally
- Customize box HTML template and CSS styles
- Display awards and conditionally format Org Chart
- Create an Org Chart with two root managers
- Change Org Chart skin
- Localize Org Chart
Show specific user on load
- Drill down to specific box using URL parameter
- Drill down to current user by default
- Drill down to manager of user from URL by default
Manage web part size and scale
- Open Org Chart in full-screen mode on load
- Make Org Chart use full page width
- Automatically scale boxes to fit visible area
Other examples
Drill down to current user by default in Org Chart
Note
For the versions earlier than 4.x.x (including on-premises ones), please follow this instruction.
Drill down to current user on Org Chart load for User Profiles
It is quite simple to implement such drill down for User Profiles data source using JavaScript framework. Just open the configuration wizard and paste the code below to JavaScript editor on Custom JavaScript step.
api.config.renderInitialNode = false;
api.onInitialLoadingFinished(() => {
api.dataProvider.getCurrentUserAccountName(function (accountName) {
api.drillDown(accountName);
});
});
Drill down to current user on Org Chart load for SharePoint list
It is more difficult to implement such behavior for SharePoint list.
First of all we have to ensure that we have field with account name of user in our SharePoint list.
In my case I created list field called “AccountName”.
Then I used JSOM to find list item by account name of current user.
I used CAML query to do this.
Once I have list item for current user I can read ID of for this item and drill down to it using JavaScript framework.
Actually you can just copy and paste the code below to JavaScript editor on Custom JavaScript step of the configuration wizard.
The only thing you may need to replace is internal name of field where account name of user is stored in SharePoint list.
Just replace AccountName
with your field internal name:
let loginFieldInternalName = "AccountName";
And it is complete script to copy paste:
const getCurrentUserOrgChartId = (completed, error) => {
const camlQueryTemplate = "<View><Query><Where><Eq><FieldRef Name='{{loginFieldInternalName}}'/><Value Type='Text'>{{currentUserLogin}}</Value></Eq></Where></Query></View>";
const listId = renderer.config.listDataSourceSettings.listId;
const orgChartIdFieldName = renderer.config.idFieldMapping.InternalFieldName;
const context = SP.ClientContext.get_current();
api.dataProvider.getCurrentUserAccountName((currentUserLogin) => {
console.log("currentUserLogin:", currentUserLogin);
currentUserLogin = currentUserLogin.replace(/.*\|/, "");
const list = context.get_web().get_lists().getById(listId);
const camlQuery = new SP.CamlQuery();
const queryText = camlQueryTemplate
.replace("{{loginFieldInternalName}}", loginFieldInternalName)
.replace("{{currentUserLogin}}", currentUserLogin);
console.log("queryText: ", queryText);
camlQuery.set_viewXml(queryText);
const foundItems = list.getItems(camlQuery);
context.load(foundItems);
context.executeQueryAsync(() => {
f = foundItems;
const en = foundItems.getEnumerator();
if (en.moveNext()) {
const fieldValuesForCurrentUser = en.get_current().get_fieldValues();
const currentUserOrgChartId = fieldValuesForCurrentUser[orgChartIdFieldName];
completed(currentUserOrgChartId);
} else {
console.log("List item for current user not found.");
}
}, (sender, args) => {
error(args);
});
});
}
let currentUserId = "";
let loginFieldInternalName = "AccountName";
api.prerenderAction = function (completed) {
getCurrentUserOrgChartId((userId) => {
currentUserId = userId;
completed();
}, (errorArgs) => {
console.log(errorArgs);
completed();
});
}
api.onInitialLoadingFinished(() => {
if (currentUserId) {
api.drillDown(currentUserId);
}
});