PrimeFaces Extensions Showcase

OrgChart

Orgchart is a simple and direct organization chart plugin. Anytime you want a tree-like chart, you can turn to OrgChart.

This component uses FontAwesome for its icons. As this is no longer included in PrimeFaces, you are required to include FontAwesome in the pages that are using Orgchart.

Based on orgchart by Xuebin Dong (@dabeng).

Use Cases

Documentation pe:orgchart

Attributes (move mouse over the names to see data types)

Name	Description
binding	An EL expression referring to a server side UIComponent instance in a backing bean.Default is generated.
chartClass	CSS class to apply to the chart container.
converter	EL expression resolves to a converter instance or literal converter ID defining a component converter.
depth	The depth of the chart to initially display.Default is 999.
direction	The direction of the chart. 't2b' (top to bottom), 'b2t' (bottom to top), 'l2r' (left to right), 'r2l' (right to left).Default is t2b.
draggable	Enable dragging nodes on the chart.Default is false.
exportButton	Enable export button on the chart.Default is false.
exportFileextension	The file extension for the exported chart.Default is png.
exportFilename	The filename for the exported chart.Default is OrgChart.
extender	Name of javascript function to extend the widget.
filterable	Render built-in filter controls for client-side node filtering.Default is false.
id	Unique identifier of the component in a namingContainer.Default is generated.
nodeContent	The node content property name.Default is title.
nodeId	The node id property name.Default is id.
nodeTitle	The node title property name.Default is name.
pan	Enable panning on the chart.Default is false.
parentNodeSymbol	The symbol to indicate a node has children.Default is fa-users.
rendered	Boolean value to specify the rendering of the component, when set to false component will not be rendered.Default is true.
style	Inline style of the component.
styleClass	Style class of the component.
toggleSiblingsResp	Toggle sibling nodes responsively.Default is false.
value	Value of the component.
verticalDepth	The depth at which the chart switches to vertical layout.
widgetVar	Name of the client side widget.
zoom	Enable zooming on the chart.Default is false.
zoominLimit	The maximum zoom-in limit.Default is 7.
zoomoutLimit	The maximum zoom-out limit.Default is 0.5.