ONLINE HELP
 WINDEVWEBDEV AND WINDEV MOBILE

Help / Developing an application or website / Controls, windows and pages / Controls: Available types / Organization Chart control
  • Overview
  • Importing the element description internal window
  • Importing the internal window that represents an element
  • Customizing the internal window
  • Displaying additional information
  • Modifying the shape of the element
  • Using several internal windows in the same Organization Chart control
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaReports and QueriesUser code (UMC)
WEBDEV
WindowsLinuxPHPWEBDEV - Browser code
WINDEV Mobile
AndroidAndroid Widget iPhone/iPadIOS WidgetApple WatchMac CatalystUniversal Windows 10 App
Others
Stored procedures
Overview
To customize the interface of an Organization Chart control, you must use specific internal windows.
Therefore, different internal windows can be used for each Organization Chart control of the same application according to the information displayed in the organization chart.
Importing the element description internal window

Importing the internal window that represents an element

The display of each element found in an Organization Chart control is based on a specific internal window. This internal window is provided with WINDEV and it can be imported into a project.
To import this internal window:
  1. Open the Organization Chart control description window.
  2. In the "General" tab, in "Internal windows for the elements", select "Preset window".
  3. The WDFAA internal component is automatically added to the current project. The "IW_WinDevViewOrgElement" internal window is automatically associated to the "Internal windows for the elements" option.
    Remark: If the WDAAF component already exists, only the window is added to the component.
  4. Validate the control description window.
Remark: You can also directly import the preset window: on the "Project" tab, in the "Project" group, expand "Import" and select "WINDEV elements and their dependencies". The "IW_WinDevViewOrgElement" window is in the "Programs\Data\Preset Windows\EN\AAF" directory.
Customizing the internal window
The internal window corresponding to an element of the Organization Chart control can be entirely customized. You have the ability to add new controls for example.
It is also possible to change the code of the internal window.

Displaying additional information

The information displayed in the internal window corresponds to the elements of the OrgElement variable. You may want to display data specific to the application.
To create the link between an element of the organization chart and an entity of the application (a contributor, a group, ...), use the ID property of the OrgElement variable:
  • For an organization chart populated programmatically, when adding an OrgElement element, the identifier of the entity must be specified in the ID property (an automatic file identifier for example).
  • For an organization chart based on a data file, the ID property is automatically filled from the links of the recursive link.
In the code of the internal window, the element to display is passed as parameter via an OrgElement variable.
PROCÉDURE IW_WinDevVewOrgElement(gOrgElement is OrgElement)
Then, use the ID property to find the additional information that will be displayed via this identifier.
In the following example, the OrgElement variable contains information about a contributor. The ID property contains the identifier of the "Contributor" file.
Then, simply find the desired information in the other files of the database via this identifier.
// Finds the contributor from his ID
HReadSeekFirst(Contributor, ContributorID, gOrgElement.ID)
// Fills the personal details of the contributor
STC_ORGELEMENT_PHONE = Contributor.Phone
BTN_ORGELEMENT.Caption = Contributor.Email
STC_ORGELEMENT_TITLE = Contributor.LastName + SPC + Contributor.FirstName

Modifying the shape of the element

The BackgroundImage property of the OrgElement variable is used to visually modify the appearance of the element.
This property is used to define the image that will be displayed in the background of the internal window. This enables you to display shapes, for example:
// Absolute (displayed in a square)
Absolute is OrgElement
Absolute.Content = "Absolute"
Absolute.BackgroundImage = "orgdiagram_02_Fuschia.png"
nParent = OrgAdd(ORG_DIAGRAM, Absolute)
// Process (displayed in a diamond)
WarmUp is OrgElement
WarmUp.Content = "Warm up, cool down, filter"
WarmUp.BackgroundImage = "orgdiagram_01.png"
nParent = OrgAddChild(ORG_DIAGRAM, nParent, WarmUp)
Using several internal windows in the same Organization Chart control
Via the internal windows, each Organization Chart control can have a different and unique appearance in the same application.
You also have the ability to use several internal windows in the same Organization Chart control.
This feature is very useful for the organization charts that display different types of elements, with different information.
To configure the internal window that will be used for an element found in the Organization Chart control, use the IWDrawing property of the OrgElement variable.
Minimum version required
  • Version 17
Comments
Change color of line
Hi guys,

I need change color of line that is between Title and Subtitle.
How is it possible?

Thanks.
Roman ROMANIV
23 Oct. 2017

Last update: 09/04/2023

Send a report | Local help