0.2.7 • Published 2 years ago

@ferdydh/d3-org-chart v0.2.7

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

Customizable organization chart, based on d3 v7

This repo is a fork from d3-org-chart by David B(twitter and LinkedIn). Our ultimate goal is to integrate typescript and react natively into the library, fix reported issues, improve customization, and provide better documentation.

Installing

npm i @ferdydh/d3-org-chart
import { OrgChart } from '@ferdydh/d3-org-chart';

type Props = {
     data: DataType[]
}

type DataType = {
     id: string | number // required property
     parentId: string | number // required property
}

export const OrgChartComponent = ({ data }: Props) => {
  const container = useRef(null);

  useEffect(() => {
    if (fields && container.current) {
      const chart = new OrgChart<DataType>()
        .container(container.current)
        .data(fields)
        .render();
    }
  }, [fields, container.current]);

  return (
    <div>
      <div ref={container} />
    </div>
  );
};

Featured:

Custom components & algorithms used

Author

Ferdy DH

0.2.7

2 years ago

0.2.6

2 years ago

0.2.5

2 years ago

0.2.4

2 years ago

0.2.3

2 years ago

0.2.2

2 years ago

0.2.1

2 years ago

0.2.0

2 years ago

3.1.1-fix

2 years ago