Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/big-camel/itellyou-drawing
文本绘图工具
https://github.com/big-camel/itellyou-drawing
flowchart graphviz latex mermaid plantuml text-drawing
Last synced: 4 months ago
JSON representation
文本绘图工具
- Host: GitHub
- URL: https://github.com/big-camel/itellyou-drawing
- Owner: big-camel
- Created: 2019-10-16T07:46:39.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-03-03T08:06:35.000Z (almost 2 years ago)
- Last Synced: 2024-10-09T17:43:26.857Z (4 months ago)
- Topics: flowchart, graphviz, latex, mermaid, plantuml, text-drawing
- Language: JavaScript
- Homepage: http://drawing.aomao.com
- Size: 363 KB
- Stars: 24
- Watchers: 3
- Forks: 11
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 文本绘图工具 [drawing.aomao.com](http://drawing.aomao.com)
### 本项目可以生成以下svg格式的工程图
+ [PlantUml](http://plantuml.com) 是一个开源项目，支持快速绘制时序图、用例图、类图、活动图、组件图、状态图、对象图、部署图等。同时还支持非 UML 图的甘特图、架构图等。采用 [node-plantuml](https://github.com/markushedvall/node-plantuml) 库生成
+ Latex 采用[mathjax](https://www.mathjax.org/) 库生成 LaTeX 数学公式
+ [Graphviz](http://www.graphviz.org/documentation/) 采用 [node-plantuml](https://github.com/markushedvall/node-plantuml) 库生成，本地需要安装[相关Graphviz包](http://www.graphviz.org/download/) 支持
+ [Flowchart](http://flowchart.js.org/) 在 [electronjs](http://electronjs.org/) 支持下，采用 [https://github.com/adrai/flowchart.js](https://github.com/adrai/flowchart.js) 库生成
+ [Mermaid](https://mermaidjs.github.io/#/) 在 [electronjs](http://electronjs.org/) 支持下，采用 [https://github.com/knsv/mermaid](https://github.com/knsv/mermaid) 库生成
### 运行
```
npm install
```
```
node app.js
```
### 访问地址
PlantUml 生成：
```
localhost:3000/puml
POST eg:
{"content":"@startuml\n\nactor A\nactor B\n\nA -up-> (up)\nA -right-> (center)\nA -down-> (down)\nA -left-> (left)\n\nB -up-> (up)\nB -left-> (center)\nB -right-> (right)\nB -down-> (down)\n\n@enduml"}
```
返回
```
{"success":true,"svg":"ABupcenterdownleftright"}
```
Latex 生成
```
localhost:3000/latex
参数形式与返回值与上方一样
```
Graphviz 生成
```
localhost:3000/graphviz
参数形式与返回值与上方一样
```
Flowchart 生成
```
localhost:3002/flowchart
参数形式与返回值与上方一样
```
Mermaid 生成
```
localhost:3001/mermaid
参数形式与返回值与上方一样
```
### 使用方式
项目搭建好后，使用反向代理就可以方便的使用文本生成相关svg图片了
```
location ^~/api/flowchart {
proxy_pass http://localhost:3002/flowchart/;
}
location ^~/api/mermaid {
proxy_pass http://localhost:3001/mermaid/;
}
location ^~/api/latex {
proxy_pass http://localhost:3000/latex/;
}
location ^~/api/graphviz {
proxy_pass http://localhost:3000/graphviz/;
}
location ^~/api/puml {
proxy_pass http://localhost:3000/puml/;
}
```