An organisation chart is a top-down hierarchical structure composed of "nodes", a root node for the top of the chart, and any number of child nodes, nested as deeply as required. There is nothing particurlarly special about the root node, it is a node just like any other.
A chart is declared using the
<OrgChart> component. Each node in the chart is
declared using an
A chart node may specify, via the
label property, a caption to display in the
node. This caption can be a simple text string or another component.
You can optionally set your own
className property on any of your chart
components and this will be applied as expected to the chart.
data-* attributes on an
<OrgChart.Node> component will be
copied to the corresponding node when the chart is generated.
A chart node may also contain any additional mark-up and other components to use as the content for that node. This content can be used in addition to, or instead of, the label property.
The generated charts will have a default stylesheet applied so that at least the basic structure is drawn correctly. You are encouraged to override as much as you want in this stylesheet in your own applications to customise each chart to your own liking - obviously for things like the colour scheme, but also for example to make the chart nodes larger to accommodate whatever content you need.