🌿 Vue.js wrapper for OrgChart.js
Switch branches/tags
Nothing to show
Clone or download
Latest commit c8de415 Jun 15, 2018

README.md

vue-orgchart logo

A Vue wrapper for OrgChart.js.

Travis Status npm

Intro

  • First of all, thanks a lot for dabeng's great work -- OrgChart.js
  • If you prefer the Vue.js Wrapper for Orgchart.js,you could try my project

Links

Feature

  • Support import and export JSON
  • Supports exporting chart as a picture
  • draggable Orgchart
  • Editable Orgchart

...

Install

npm install vue-orgchart -S

Quick Start

In main.js

import 'vue-orgchart/dist/style.min.css'

In *.vue

<template>
  <div>
    <vo-basic :data="chartData"></vo-basic>
  </div>
</template>

<script>
import { VoBasic } from 'vue-orgchart'
export default {
  components: { VoBasic }
  created () {
    this.chartData = {
      name: 'JavaScript',
        children: [
          { name: 'Angular' },
          {
            name: 'React',
            children: [{ name: 'Preact' }]
          },
          {
            name: 'Vue',
            children: [{ name: 'Moon' }]
          }
        ]
    }
}
</script>

Development

# install dependencies
npm install

# serve with hot reload at localhost:8999
npm run dev

# unit test
npm run test

# build by rollup
npm run rollup

License

MIT