https://github.com/pwcong/react-org-chart

Organization Chart written in React. https://pwcong.github.io/react-org-chart/index.html
https://github.com/pwcong/react-org-chart

react react-org-chart

Last synced: 3 months ago
JSON representation

Organization Chart written in React. https://pwcong.github.io/react-org-chart/index.html

• Host: GitHub
• URL: https://github.com/pwcong/react-org-chart
• Owner: pwcong
• License: mit
• Created: 2019-11-27T09:47:17.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2022-12-11T15:03:05.000Z (over 2 years ago)
• Last Synced: 2024-04-14T07:27:09.905Z (about 1 year ago)
• Topics: react, react-org-chart
• Language: TypeScript
• Homepage:
• Size: 3.59 MB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 27
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# React Org Chart

Organization Chart written in React. Preview demo here [https://pwcong.github.io/react-org-chart/index.html](https://pwcong.github.io/react-org-chart/index.html)

### How to use

```tsx

import React from 'react';

import ReactDOM from 'react-dom';

import ReactOrgChart from '../src/index';

let counter = 0;

ReactDOM.render(

   ({

        name: '人员',

        avatar: ''

      })),

      hasChildren: true

    }}

    getChildren={(node) =>

      new Promise((resolve) => {

        counter++;

        resolve(

          Array.from(Array(3)).map((_, i) => ({

            id: `sub-${counter}-${i}`,

            name: '子部门',

            hasChildren: true

          }))

        );

      })}

  />,

  document.getElementById('root')

);

```