Organization Chart
Hierarchical org chart rendered top-down with CSS-drawn connector lines, supporting JSON data or slotted pura-org-node elements.
Preview
Attributes
| Attribute | Type | Default | Description |
|---|---|---|---|
data | string | — | JSON string representing the nested org chart data ({label, children:[...]}). |
collapsible | boolean | — | Allows clicking a node to toggle its subtree visibility. |
Installation
pura is copy-paste and dependency-free. Load the whole library, or just this component.
<link rel="stylesheet" href="/pura/tokens.css">
<script type="module" src="/pura/lib/organization-chart.js"></script>import "./pura/lib/organization-chart.js";