图表使用
大约 17 分钟
| Diagram Type | 已阅 |
|---|---|
| BlockDiag | ✔️ |
| BPMN | ️ ✔️ |
| Bytefield | ️ ✔️ |
| SeqDiag | ✔️ |
| ActDiag | ✔️ |
| NwDiag | ✔️ |
| PacketDiag | ✔️ |
| RackDiag | ✔️ |
| C4 with PlantUML | ✔️ |
| D2 | ✔️ |
| DBML | ✔️ |
| Ditaa | ✔️ |
| Erd | ✔️ |
| Excalidraw | ️ ✔️ |
| GraphViz | ✔️ |
| Mermaid | ✔️ |
| Nomnoml | ️ ✔️ |
| Pikchr | ️ ✔️ |
| PlantUML | ✔️ |
| Structurizr | ✔️ ️ |
| Svgbob | ️ ✔️ |
| Symbolator | ️ ✔️ |
| TikZ | ✔️ ️ |
| UMlet | ✔️ |
| Vega | ✔️ |
| Vega-Lite | ✔️ |
| WaveDrom | ✔️ |
| WireViz | ✔️ |
bpmn
类似于draw.io，可以自由绘制，然后生成代码
BPMN Editor | demo.bpmn.io
Create, view and edit BPMN 2.0 diagrams with bpmn-js (bpmn.io) tooling
bytefield
Introduction :: bytefield-svg
blockdiag
Sample diagrams — blockdiag 1.0 documentation
seqdiag
Sample diagrams — blockdiag 1.0 documentation
actdiag
nwdiag
packetdiag¶
rackdiag
plantuml
C4-plantuml
GitHub - plantuml-stdlib/C4-PlantUML: C4-PlantUML combines the benefits of PlantUML and the C4 model for providing a simple way of describing and communicate software architectures
C4-PlantUML combines the benefits of PlantUML and the C4 model for providing a simple way of describing and communicate software architectures - GitHub - plantuml-stdlib/C4-PlantUML: C4-PlantUML co...
d2
Home | D2 Documentation
D2 is a modern DSL that turns text to diagrams.
D2 Playground
An online runner to play, learn, and create with D2, the modern diagram scripting language that turns text to diagrams.
erd
graphviz
Gallery
Graph Visualization Software
在Graphviz中画出好看的二叉树、B树、如何使用pos变量_HellHellNo的博客-CSDN博客
1、前提使用过Graphviz画二叉树的同学都会发现，画出来的东西没有向教材那样规规矩矩，对于有强迫症的同学来说，可以采用以下思路进行完善2、IDEA + Dot@startumldigraph btree { graph [nodesep=0.1, pad=0.02, ranksep=0.5] node [shape=circle, style=bold, fontsize=22, fontname=Consolas, width=0.8, height=0.8] edge_好看的二叉树
GraphViz 使用教程-用代码生成有向图。并介绍流程图、时序图等绘图工具_graphviz 教程_youwen21的博客-CSDN博客
@[TOC]GraphViz 使用教程综合篇GraphViz简述GraphViz是一个使用DOT编程语言生成有向图，无向图等图。支持多种编辑器和支持几乎常见的所有开发语言调用的一款工具。函数调用关系，程序执行过程，组织架构等常见语言如go,php,java,c等言语图形化分析工具背后都需要GraphViz的支持。下载安装GraphViz支持Linux , Windows , Mac系统..._graphviz 教程
绘制二叉树
B树
vega
类似于
echarts，可以画一些统计图
Example Gallery
Vega - A Visualization Grammar. Vega is a visualization grammar, a declarative format for creating, saving, and sharing interactive visualization designs. With Vega, you can describe the visual appearance and interactive behavior of a visualization in a JSON format, and generate web-based views using Canvas or SVG.
vega lite
Example Gallery
Vega-Lite - a high-level grammar for statistical graphics. Vega-Lite provides a higher-level grammar for visual analysis, comparable to ggplot or Tableau, that generates complete Vega specifications. Vega-Lite specifications consist of simple mappings of variables in a data set to visual encoding channels such as x, y, color, and size. These mappings are then translated into detailed visualization specifications in the form of Vega specification language. Vega-Lite produces default values for visualization components (e.g., scales, axes, and legends) in the output Vega specification using a rule-based approach, but users can explicit specify these properties to override default values.
DBML
花类图，在线编辑器挺好
DBML - Database Markup Language | DBML
excalidraw
绘制的图可以将数据下载到本地
Excalidraw — Collaborative whiteboarding made easy
Excalidraw is a virtual collaborative whiteboard tool that lets you easily sketch diagrams that have a hand-drawn feel to them.
structurizr
Structurizr - DSL
Visualise, document and explore your software architecture with Structurizr
svgbob
Svgbob can create a nice graphical representation of your text diagrams.
https://ivanceras.github.io/svgbob-editor/
tikz
可以画数学图形
GitHub - pgf-tikz/pgf: A Portable Graphic Format for TeX
A Portable Graphic Format for TeX. Contribute to pgf-tikz/pgf development by creating an account on GitHub.
TikZ and PGF examples
wavedrom
Hitchhiker's Guide to the WaveDrom
wireviz
WireViz/examples/readme.md at master · wireviz/WireViz
Easily document cables and wiring harnesses. Contribute to wireviz/WireViz development by creating an account on GitHub.
nomnoml
Nomnoml
A tool for drawing diagrams based on syntax. Supercharge you boxes and arrows.
pikchr
Pikchr: Pikchr Examples
Symbolator¶
Symbolator — Symbolator 1.0.2 documentation
umlet
UMLet Homepage - Free UML Tool