# simple-flow-chart

> Simple-flow-chart is a quick and convenient Vue plug-in to realize flow chart based on Vue-super-flow

Latest version **1.0.12** (published 2022-02-18) · MIT license · 0 weekly downloads

## Install

```sh
npm install simple-flow-chart
pnpm add simple-flow-chart
yarn add simple-flow-chart
bun add simple-flow-chart
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.12 |
| Published | 2022-02-18 |
| First published | 2021-08-18 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 182.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | jaydon |
| Maintainers | ivshow, meimeih5 |
| Keywords | flowChart, super flow, vue flow chart, vue 流程图 |

## Links

- npm: https://www.npmjs.com/package/simple-flow-chart
- Homepage: https://github.com/ivshow/simple-flow-chart.git
- npm.io page: https://npm.io/package/simple-flow-chart

## Dependencies (2)

- [vue-js-modal](https://npm.io/package/vue-js-modal.md) ^2.0.1
- [vue-clipboard2](https://npm.io/package/vue-clipboard2.md) ^0.3.1

## Alternatives

- [d3-force-3d](https://npm.io/package/d3-force-3d.md) — 1.0M weekly downloads
- [ng2-charts](https://npm.io/package/ng2-charts.md) — 486.8K weekly downloads
- [@arcgis/core](https://npm.io/package/@arcgis/core.md) — 257.8K weekly downloads
- [react-sparklines](https://npm.io/package/react-sparklines.md) — 249.3K weekly downloads
- [react-native-gifted-charts](https://npm.io/package/react-native-gifted-charts.md) — 182.3K weekly downloads

## Recent versions

- 1.0.12 (latest) — 2022-02-18
- 1.0.11 — 2022-02-18
- 1.0.10 — 2021-11-03
- 1.0.9 — 2021-11-03
- 1.0.8 — 2021-10-27
- 1.0.7 — 2021-10-26
- 1.0.6 — 2021-10-21
- 1.0.5 — 2021-09-29
- 1.0.4 — 2021-08-30
- 1.0.3 — 2021-08-27
- 1.0.2 — 2021-08-18
- 1.0.1 — 2021-08-18

## README

# simple-flow-chart

- Vue 流程图
- 基于 [Vue-super-flow](https://www.npmjs.com/package/vue-super-flow)

## 安装

```bash
npm install simple-flow-chart
# OR
yarn add simple-flow-chart
```

```js
import SimpleFlowChart from 'simple-flow-chart';
import 'simple-flow-chart/lib/index.css';

Vue.use(SimpleFlowChart);
```

## 属性

| 属性     | 类型               | 默认值             | 描述               |
| -------- | ------------------ | ------------------ | ------------------ |
| range    | `Array`            | `['start', 'end']` | 需要高亮的节点区间 |
| maxTotal | `String \| Number` | `0`                | 最大限制           |

## 方法

| 方法名        | 说明                         | 参数 |
| ------------- | ---------------------------- | ---- |
| addNodeIfNeed | 当拖到容器中时，自动添加节点 | ---- |
| addTemplate   | 添加模板节点                 | ---- |

## 示例

![默认示例](https://s1.ax1x.com/2020/07/27/ai6iAe.gif)

![进阶示例](https://s1.ax1x.com/2020/07/27/aisqzt.gif)

---
_Source: https://npm.io/package/simple-flow-chart · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._