@moonwane/vue3-org-chart

Forked from n1crack/vue3-org-chart. Vue3 Org Chart is a tree diagram that visualizes the structure of an organization and the relationships and relatives. It is a Vue 3 component.
3,672 1
Install
npm install @moonwane/vue3-org-chart
Latest Version:1.0.0
Vue:3
License:MIT
Last Updated:Apr 10, 2025
Links: GitHub  ·  npm
Maintainer: moonwane

Vue3 Org Chart

Forked from n1crack/vue3-org-chart. Please refer to its README for original usage.

Breaking Changes

  • The OrgChart component is now a generic component. It now infers the type of data, which determines the type of item prop of the node slot. So you don't need to type cast item from any to the type of data you are passing to the component now.

    generic-typed

  • The component no longer returns an api object through the on-ready event. It now directly expose the following methods: resetZoom, zoomIn, zoomOut, expandAll, and collapseAll. The original minimap.toggle method is removed. You can just manipulate the value of minimap you pass to the component to toggle the minimap.

  • You can no longer use app.use() to globally register the component because it's now a generic component. Just import the component and use it directly. Don't forget to import the stylesheet.

  • The json prop is deprecated. Please fetch the data first, type it, and then pass it to the component.

Related Packages

vue3-org-chart

Vue3 Org Chart is a tree diagram that visualizes the structure of an organizatio...

25,215 33
vue-jstree

a tree plugin for vue2

137,015 630
vue-tree-list-new

A vue component for tree structure. Support adding treenode/leafnode, editing no...

902 1
hu-tree

tree

636
vue3-treeselect

Tree select hierarchical component for vue 3 (next)

296,815 100

Version History

Version Released Vue License
1.0.0 ^3.5.0 MIT
0.1.0 ^3.2.0 MIT