https://github.com/BALKANGraph/OrgChartJS

OrgChart JS is a simple, flexible and highly customizable organization chart plugin for presenting the structure of your organization and the relationships in an elegant way.
https://github.com/BALKANGraph/OrgChartJS

Last synced: 4 months ago
JSON representation

OrgChart JS is a simple, flexible and highly customizable organization chart plugin for presenting the structure of your organization and the relationships in an elegant way.

• Host: GitHub
• URL: https://github.com/BALKANGraph/OrgChartJS
• Owner: BALKANGraph
• Created: 2018-10-22T18:02:19.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2024-05-17T07:23:49.000Z (9 months ago)
• Last Synced: 2024-05-20T16:37:52.750Z (9 months ago)
• Homepage: https://balkan.app/orgchartjs
• Size: 2.96 MB
• Stars: 244
• Watchers: 11
• Forks: 83
• Open Issues: 37
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# ![OrgChart JS](https://balkangraph.com/content/img/icon-orgchart-js.png) OrgChart JS

Build organizational chart app with BALKAN OrgChart JS JavaScript library. **OrgChart JS** is a simple, flexible and highly customizable organization chart plugin for presenting the structure of your organization and the relationships in an elegant way.

![OrgChart JS](https://balkan.app/Content/Img/oc.png)

## [Demos](https://balkan.app/OrgChartJS/Demos/BasicUsage)        [Docs](https://balkan.app/OrgChartJS/Docs/GettingStarted)        [Download](https://balkan.app/OrgChartJS/Download)       [Support](https://balkan.app/OrgChartJS/Support)

## Features

- Supports both local data and remote data (JSON)

- Smooth expand/collapse effects

- Align the chart in 8 orientations

- Allows user to change orgchart structure by drag/drop nodes

- Supports pan and zoom

- Edit Form

- Node Customization

- Search

- Scroll Bars

- Lazy Loading

- Mixed Hierarchy

- Exporting

- Assistant

- Partners

- Sub Trees

- Family Tree

## Installation

Option 1 - [standalone build](https://balkan.app/OrgChartJS/Docs/GettingStarted)

Option 2 - NPM

```

npm i @balkangraph/orgchart.js

```

Option 3 - Bower

```

bower install orgchart.js

```

## Usage

```



 

var chart = new OrgChart(document.getElementById("tree"), {

    nodeBinding: {

        field_0: "name"

    },

    nodes: [

        { id: 1, name: "Amber McKenzie" },

        { id: 2, pid: 1, name: "Ava Field" },

        { id: 3, pid: 1, name: "Peter Stevens" }

    ]

});


```

## 1 click to talk 2 us

[![OrgChart](https://balkangraph.com/content/img/phone-icon4.png)](https://webcall.me/BALKANGraph)