mirror of
https://github.com/markmanx/isoflow.git
synced 2025-02-08 12:27:53 +00:00
65 lines
No EOL
2.6 KiB
Markdown
65 lines
No EOL
2.6 KiB
Markdown
![readme-header](https://user-images.githubusercontent.com/1769678/223572353-788d5d38-cd28-40fa-96cd-9d29226f7e4b.png)
|
|
|
|
<h4 align="center">
|
|
<a href="https://v2.isoflow.io/">Isoflow Editor</a> |
|
|
<a href="https://v2.isoflow.io/docs">Documentation</a> |
|
|
<a href="https://github.com/markmanx/isoflow">Github</a> |
|
|
<a href="https://discord.gg/QYPkvZth7D">Discord</a>
|
|
</h4>
|
|
|
|
<div align="center">
|
|
<h1>An open-source React component for drawing network diagrams.</h2>
|
|
</div>
|
|
|
|
<div align="center">
|
|
|
|
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
|
|
![CircleCI](https://circleci.com/gh/markmanx/isoflow.svg?style=shield)
|
|
|
|
</div>
|
|
|
|
## Key Features
|
|
|
|
- **Highly visual drag and drop interface:** Express your architecture with icons, regions and connectors.
|
|
- **Customizable:** Easily extend Isoflow with your own icons.
|
|
- **Export options:** Export diagrams as code or images.
|
|
|
|
## Roadmap
|
|
|
|
🛠 v0.5: In progress
|
|
- [x] More control over connector segments
|
|
- [x] Connector labels
|
|
- [ ] Layer re-ordering (bring forward / send to back)
|
|
- [ ] Shortcuts (undo / redo, copy / paste)
|
|
- [ ] Custom colours
|
|
- [ ] Export diagrams as images
|
|
- [ ] Main menu customisation
|
|
- [ ] Center diagram in middle of canvas
|
|
|
|
✅ v0.4: Complete
|
|
- [x] Basic view controls (pan / zoom)
|
|
- [x] Nodes, connectors & groups
|
|
- [x] Import / export diagrams to local storage (in JSON format)
|
|
- [x] Icon support for AWS, GCP, Azure, K8S & generic network hardware (e.g. server, database)
|
|
- [x] onSceneUpdated callback
|
|
- [x] Documentation
|
|
- [x] Pipeline for publishing to NPM
|
|
|
|
## Quick start
|
|
|
|
Install the Isoflow editor [npm package](https://www.npmjs.com/package/isoflow) and isopacks (icon packages):
|
|
|
|
- `npm install isoflow`
|
|
- `npm install @isoflow/isopacks`
|
|
|
|
For more information, see our [documentation](https://v2.isoflow.io/docs).
|
|
|
|
## CodeSandbox demo
|
|
Demo the latest version of Isoflow on [CodeSandbox](https://codesandbox.io/p/sandbox/github/markmanx/isoflow). The sandbox will always be synced with the `main` branch on the Github repo, and also includes the latest version of the developer documentation.
|
|
|
|
## Using Isoflow commercially?
|
|
Isoflow is free to use for personal and commercial projects. If you're using Isoflow commercially, please consider sponsoring the project (please get in touch).
|
|
|
|
## Contributing
|
|
- Isoflow is actively being worked on. Missing something or found a bug? Report it [here](https://github.com/markmanx/isoflow/issues) or join our [Discord server](https://discord.gg/QYPkvZth7D).
|
|
- Want to contribute? See [good first issues](https://github.com/markmanx/isoflow/contribute). |