Package Exports
- awesome-react-org-chart
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (awesome-react-org-chart) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
Awesome React Org Chart 👥
Supports large organization charts with multiple compaction/packing techniques to improve readability and accessibility.
Example
import OrgChart from "awesome-react-org-chart";
<OrgChart
// required
root={nodes[0]}
isValidNode={this.isValidNode}
keyGetter={this.keyGetter}
renderNode={this.renderNode}
childNodesGetter={this.childNodesGetter}
// optional (but recommended)
lineHorizontalStyle={this.lineHorizontalStyle}
lineVerticalStyle={this.lineVerticalStyle}
// optional
measureStrategy="effect"
connectorThickness={2}
connectorAlignment={ConnectorAlignment.Center}
isAssistantGetter={this.isAssistantGetter} // wip
layout={layout}
containerStyle={this.containerStyle}
renderNodeContainer={this.renderNodeContainer}
renderNodeLine={this.renderNodeLine}
debug={debug}
/>;Animation
The OrgChart uses transform3d to position items on the screen. CSS transitions along with some React/JavaScript can be used to make animations.
No React? Example!
The OrgChart does not need to use React. Please refer to the VanillaExample.ts file in the repo to learn more.