Using npm:
$ npm i butterfly-react butterfly-dag -Splease refer to React Demo
| Prop | Type | Description | Default |
|---|---|---|---|
| nodes | INode[] | [] | |
| egdes | IEdge[] | [] | |
| groups | IGroup[] | [] | |
| options | Object | see | |
| onEdgesChange | (IEdge[]) => void; | ||
| onCreateEdge | (IEdge) => void; | ||
| onDeleteEdge | (IEdge) => void; | ||
| className | String | ||
| onLoaded | (canvas) => void; | Canvans onLoaded event |
interface INode {
id: string | number; // recommend string (require)
render: () => JSX.Element; // Custom render function (require)
// Other Options see https://github.com/alibaba/butterfly/blob/master/docs/zh-CN/node.md#node-attr
} interface IEdge {
id: string | number; // recommend string (require)
labelRender?: () => JSX.ESLint; // Custom label render function (optional)
// Other Options see https://github.com/alibaba/butterfly/blob/master/docs/zh-CN/edge.md
} interface IGroup {
id: string | number;
}