拓冰网站定制 
概述之前汇总介绍过好多款绘图工具其中大部分都简单体验过部分深度使用超强大免费绘图工具draw.io初体验Mermaid语法、实战画图工具汇总Excalidraw、tldraw、Drawnix、Drawio绘图工具汇总FossFLOW、LogicFlow、oxdraw、LucidChart、iCraft Editor代码画图项目、Skill插件汇总Next AI Draw.io、Fireworks-Tech-Graph、Architecture Diagram Generator、Excalidraw DiagramAI绘图项目Beautiful-Mermaid、LikeC4、DeepDiagram画布项目Rnote、Lorien、Infinite-Canvas、open-ai-canvas这里面既有传统的绘图工具也有用代码形式绘制图表的工具还有诞生于AI、LLM时代的绘图工具还有调教AI智能体来生成意图表达更精确、样式更精美的技能。个人的认知用代码形式绘图会是未来发展的趋势再借助于提示词或技能插件可极大提高个人工作、团队协作效率。因为用代码生成图表可复用、可版本管理、修改成本极低还能直接放进文档和PPT。DiagramsPython生态适合云架构图、系统架构图、服务依赖图特点用Python写架构组件库丰富AWS / GCP / Azure都支持优点图表表达很工程化适合写技术方案和架构设计文档适用人群后端、架构师、云原生开发Mermaid适合流程图、时序图、状态图、类图、甘特图特点语法简单Markdown直接支持很多文档平台都能渲染优点学习成本低上手快写文档必备适用场景README、技术博客、团队文档、需求流程梳理Markmap适合思维导图、知识体系整理、课程笔记特点Markdown一键生成脑图优点写笔记时非常爽结构清晰复盘能力拉满适用场景学习路线、项目拆解、面试知识点整理ASCII Editors字符画流程图适合快速画草图、终端环境下画图特点用ASCII字符画框架图/流程图优点轻量、速度快不依赖复杂工具适用场景临时讨论、技术沟通、写在注释里也能看懂PlantUML适合UML图类图、时序图、用例图等特点用文本描述UML生成规范图形优点严谨、标准化适合企业级开发文档适用人群Java开发、系统设计、需要输出标准UML的团队参考UML入门以及Plant UML工具介绍。Go-Diagrams适合网络拓扑、系统架构图、云组件图特点用Go语言描述架构图优点对Go开发者非常友好可集成到工程里自动生成适用场景Go项目文档、基础设施架构展示选型总结怎么选如果你只是写文档、画流程选Mermaid如果你要画UML标准图选PlantUML如果你做云架构设计选Diagrams如果你爱做笔记复盘选Markmap如果你想快速画草图ASCII Editors如果你是Go开发Go-Diagrams个人建议MermaidMarkmap基本能覆盖日常80%的需求。学会之后你会发现写文档效率直接翻倍。Diagrams官网、基于PythonTypeScript实现的开源GitHub42.7K Star2.7K Fork架构图绘制库无需借助Visio、ProcessOn、Draw.io等图形工具仅通过代码即可快速生成云服务、微服务、Web服务等架构图。其底层依赖Graphviz渲染图像将代码逻辑转化为结构化图形支持AWS、Azure、阿里云、K8s等主流云平台图标。优缺点分析优点是代码化绘图、版本可控、集成开发流程适合程序员快速输出架构图缺点是复杂自定义图形能力较弱依赖Graphviz环境实现图像渲染过度复杂的流程图绘制效率较低。内置大量云厂商图标满足不同场景需求AWSEC2、RDS、S3、Lambda、ELB等Azure虚拟机、SQL数据库、存储等阿里云ECS、RDS、OSS、SLB等KubernetesPod、Service、Ingress、Node等通用组件Client、Server、DB、Nginx、Docker等核心概念Diagram画布定义图表名称、方向、输出格式等Node节点代表架构中的组件服务器、数据库、客户端等Cluster集群用于对节点进行分组形成逻辑区域基础绘图流程导入Diagram与对应资源模块创建Diagram对象设置图表信息定义节点使用符号建立节点间调用关系运行代码自动生成PNG、SVG格式图片实战从PyPI下载Python包pip install diagrams入门案例fromdiagramsimportDiagramfromdiagrams.aws.computeimportEC2fromdiagrams.aws.databaseimportRDSfromdiagrams.aws.networkimportELB# 定义图表名称、方向、输出格式withDiagram(Web 服务架构,showFalse,directionLR):# 定义节点与调用关系ELB(负载均衡)EC2(Web 服务器)RDS(数据库)解读with Diagram(...)创建绘图上下文自动管理资源directionLR表示从左到右绘图也可使用TB从上到下showFalse表示运行后不自动打开图片仅保存节点使用对应云服务图标名称可自定义代码运行成功后会在当前目录生成名为web_服务架构.png的架构图直观展示负载均衡、Web服务器、数据库的调用流程。当架构中存在多个同类组件时可使用Cluster进行分组让图表结构更清晰。fromdiagramsimportDiagram,Clusterfromdiagrams.aws.computeimportEC2fromdiagrams.aws.databaseimportRDS,ElastiCachefromdiagrams.aws.networkimportELBfromdiagrams.aws.storageimportS3withDiagram(复杂 Web 架构,showFalse,directionLR):# 定义客户端clientEC2(用户客户端)# 前端服务集群withCluster(前端服务组):lbELB(负载均衡)servers[EC2(Web 1),EC2(Web 2),EC2(Web 3)]# 数据服务集群withCluster(数据层):dbRDS(主库)cacheElastiCache(Redis缓存)storageS3(对象存储)# 建立调用关系clientlbservers serversdb serverscache serversstorage解读Cluster可将多个节点包裹形成独立视觉区域列表形式可批量定义同类节点简化代码支持一对多、多对一的连接关系自动生成连线微服务基础架构fromdiagramsimportDiagram,Clusterfromdiagrams.onprem.clientimportUserfromdiagrams.onprem.computeimportServerfromdiagrams.onprem.databaseimportPostgreSQLfromdiagrams.onprem.inmemoryimportRedisfromdiagrams.onprem.networkimportNginxfromdiagrams.onprem.queueimportRabbitMQfromdiagrams.onprem.loggingimportELKwithDiagram(微服务架构,showFalse,directionTB):userUser(用户)withCluster(网关层):gatewayNginx(网关服务)withCluster(业务微服务):user_serviceServer(用户服务)order_serviceServer(订单服务)pay_serviceServer(支付服务)withCluster(中间件):mqRabbitMQ(消息队列)cacheRedis(缓存)dbPostgreSQL(数据库)withCluster(日志监控):elkELK(日志系统)usergateway gateway[user_service,order_service,pay_service][user_service,order_service,pay_service]mq[user_service,order_service,pay_service]cache[user_service,order_service,pay_service]db[user_service,order_service,pay_service]elk解读使用onprem系列节点适用于自建机房、私有部署架构清晰划分网关层、业务服务、中间件、监控系统多服务统一调用中间件结构一目了然前后端分离项目fromdiagramsimportDiagramfromdiagrams.onprem.clientimportUserfromdiagrams.onprem.computeimportServerfromdiagrams.onprem.containerimportDockerfromdiagrams.onprem.databaseimportMongoDBfromdiagrams.onprem.networkimportNginxfromdiagrams.programming.languageimportPython,Javascriptfromdiagrams.devopsimportGit,JenkinswithDiagram(前后端分离架构,showFalse):userUser(用户)frontendJavascript(前端 Vue/React)webNginx(Web 服务)backendPython(后端服务)dbMongoDB(数据库)withCluster(DevOps 流程):gitGit(代码仓库)ciJenkins(CI/CD)dockerDocker(容器部署)userfrontendwebbackenddb gitcidockerbackend解读支持编程语言、DevOps工具、容器等通用节点完整展示从用户访问到开发部署的全流程适合前后端分离项目、前端开发、全栈开发场景DockerKubernetes架构fromdiagramsimportDiagram,Clusterfromdiagrams.onprem.clientimportUserfromdiagrams.onprem.containerimportDockerfromdiagrams.k8s.computeimportPod,Deploymentfromdiagrams.k8s.networkimportIngress,Servicefromdiagrams.k8s.clusterimportNodefromdiagrams.onprem.monitoringimportPrometheus,GrafanawithDiagram(K8s 容器架构,showFalse,directionLR):userUser(用户)withCluster(K8s 集群):ingressIngress(入口)svcService(服务)deployDeployment(部署)pods[Pod(Pod 1),Pod(Pod 2)]nodeNode(工作节点)withCluster(监控系统):promPrometheus(监控采集)grafGrafana(可视化)dockerDocker(容器)useringresssvcdeploypodsnode podsdocker podsprom promgraf解读专门提供Kubernetes全套图标适配云原生场景展示Ingress、Service、Deployment、Pod层级关系适合运维、云原生、后端开发人员使用电商平台极简架构fromdiagramsimportDiagram,Clusterfromdiagrams.onprem.clientimportUserfromdiagrams.onprem.networkimportNginxfromdiagrams.onprem.computeimportServerfromdiagrams.onprem.databaseimportMySQLfromdiagrams.onprem.queueimportRabbitMQfromdiagrams.onprem.inmemoryimportRedisfromdiagrams.aws.storageimportS3fromdiagrams.onprem.securityimportVaultwithDiagram(电商平台架构,showFalse):usersUser(用户)withCluster(接入层):lbNginx(负载均衡)withCluster(业务服务):goodsServer(商品服务)orderServer(订单服务)payServer(支付服务)user_srvServer(用户服务)withCluster(数据与中间件):dbMySQL(业务库)redisRedis(缓存)mqRabbitMQ(消息队列)ossS3(图片存储)secretVault(密钥管理)userslb[goods,order,pay,user_srv][goods,order,pay,user_srv][db,redis,mq,oss,secret]解读覆盖电商核心服务用户、商品、订单、支付包含数据库、缓存、消息队列、对象存储、密钥服务结构简洁可直接用于项目介绍与架构说明个人项目/博客系统架构fromdiagramsimportDiagramfromdiagrams.onprem.clientimportUserfromdiagrams.onprem.networkimportNginxfromdiagrams.programming.languageimportPythonfromdiagrams.onprem.databaseimportSQLitefromdiagrams.onprem.hostingimportServerfromdiagrams.devopsimportVercelwithDiagram(个人博客架构,showFalse):userUser(访客)nginxNginx(Web 服务)backendPython(Django/Flask)dbSQLite(轻量数据库)deployVercel(云部署)serverServer(轻量服务器)usernginxbackenddb deployserver serverbackend解读适合个人博客、小型工具、毕业设计项目使用轻量组件部署简单成本低图表清晰适合写在项目README中图表样式配置fromdiagramsimportDiagramfromdiagrams.aws.computeimportEC2withDiagram(自定义样式,showFalse,directionLR,filenamecustom_style,outformatsvg,graph_attr{fontsize:16,bgcolor:white,labeljust:center},node_attr{fontsize:12,shape:box,style:filled}):EC2(自定义节点样式)解读filename指定输出文件名outformat支持PNG、SVG、PDF等格式graph_attr与node_attr可自定义背景、字体、形状、颜色批量节点简化写法fromdiagramsimportDiagramfromdiagrams.aws.computeimportEC2withDiagram(批量节点,showFalse):# 列表快速生成多个节点web_servers[EC2(fWeb{i})foriinrange(1,4)][EC2(入口)]web_servers解读使用列表推导式快速生成多个同类节点适合大规模服务架构减少重复代码D2官网Declarative Diagramming缩写开源GitHub25.6K Star759 Fork、Go实现、现代化的文本生成图表Text-to-Diagram语言开发者通过编写简洁的文本即可自动生成流程图、系统架构图、网络拓扑图、实体关系图、时序图等各种可视化图表。功能类似于 Mermaid、PlantUML但在布局能力、美观度、主题系统和工程化支持方面更加现代化。在线体验直接输入文本即可生成和导出相应的图表。官方文档。功能特性语法简单D2采用声明式语法用户只需使用接近自然语言的文本描述节点和关系即可完成流程图、架构图、数据流图等复杂图表的绘制。丰富的图形提供丰富的内置图形体系涵盖矩形、圆形、菱形、六边形等基础图形以及人物、数据库、云、文档、队列、软件包、SQL表等面向软件架构和数据建模的专业图形。同时还支持通过image图形加载自定义Logo和Icon实现AWS、Azure、SAP、Kubernetes等企业级架构元素的可视化展示。自动布局内置多种布局引擎Dagre、ELK、TALA并具备强大的自动布局能力用户只需定义节点及其关系无需手工调整位置和连线系统即可自动生成结构清晰、美观专业的图表。Markdown支持原生支持Markdown内容嵌入允许在图表中直接添加标题、说明文档、列表、代码片段等富文本信息。代码高亮支持代码高亮展示能够在图表中直接嵌入带语法高亮的代码片段使架构设计与实现代码紧密结合。LaTeX公式支持基于MathJax的数学公式渲染允许用户在图表中直接嵌入复杂的数学表达式、公式和科学符号并且自动生成高质量的可视化展示效果。变量与替换允许用户在图表中定义和复用变量将颜色、样式、名称、配置参数等公共内容集中管理并且在多个位置引用。动画功能能够根据文本描述生成动态演示效果让图表不仅展示静态结构还可以呈现流程演进、状态变化和事件发生过程。专业主题系统提供多种由设计师精心打造的视觉主题用户无需额外设计即可生成美观、统一且适合展示的专业图表。导出格式支持将图表导出为多种主流格式包括SVG、PNG、PDF等静态文件格式以及适用于网页展示的高质量矢量图输出。多语言支持具备优秀的多语言支持能力全面兼容Unicode字符集能够在图表中直接使用中文、英文、日文、韩文、法文以及Emoji等多种字符内容无需额外配置即可正确显示。跨平台使用支持Windows、macOS和Linux等主流操作系统并且提供统一的命令行工具和一致的使用体验。提供在线Playground、VS Code、Obsidian和Vim等编辑器支持。扩展生态除官方提供的插件外还支持通过Python、JavaScript、C#等SDK动态生成图表并可与MkDocs、MdBook、Pandoc等文档系统集成实现图表自动渲染和文档自动化。此外社区还提供PostgreSQL、MySQL、MongoDB到D2的数据库建模工具以及Structurizr到D2的架构模型导出工具能够将D2无缝融入软件开发、系统架构设计、知识管理和DevOps流程中。实战打开官方提供在线演示快速体验功能解读布局引擎Layout Engine支持Dagre、ELK、TALA主题Theme支持Neutral default、Neutral gray、Flagship Terrastruct、Cool classics、Mixed berry blue、Grape soda、Aubergine、Colorblind clear、Vanilla nitro cola、Orange creamsicle、Shirley temple、Earth tones、Everglade green、Buttered toast、Dark mauve、Dark Flagship Terrastruct、Terminal、Terminal grayscale、Origami渲染器Renderer支持SVG、Sketch、ASCII导出Export支持PNG、SVGommoh-my-*系列迎来又一个成员oh-my-mermaid缩写官网开源GitHub2.3K Star197 Fork。oh-my-*系列其他项目oh-my-codexoh-my-pioh-my-opencode类似工具Code2Architecture、Nexus-skills实战基于npm快速安装npm install -g oh-my-mermaid命令行使用示例omm setup配置中文输出omm config language zh执行omm scan命令产出.omm/ ├── overall-architecture/ │ ├── description.md │ ├── diagram.mmd │ ├── context.md │ ├── main-process/ │ │ ├── description.md │ │ └── diagram.mmd │ └── renderer/ ├──> 画图项目：Diagrams、D2、omm
概述之前汇总介绍过好多款绘图工具其中大部分都简单体验过部分深度使用超强大免费绘图工具draw.io初体验Mermaid语法、实战画图工具汇总Excalidraw、tldraw、Drawnix、Drawio绘图工具汇总FossFLOW、LogicFlow、oxdraw、LucidChart、iCraft Editor代码画图项目、Skill插件汇总Next AI Draw.io、Fireworks-Tech-Graph、Architecture Diagram Generator、Excalidraw DiagramAI绘图项目Beautiful-Mermaid、LikeC4、DeepDiagram画布项目Rnote、Lorien、Infinite-Canvas、open-ai-canvas这里面既有传统的绘图工具也有用代码形式绘制图表的工具还有诞生于AI、LLM时代的绘图工具还有调教AI智能体来生成意图表达更精确、样式更精美的技能。个人的认知用代码形式绘图会是未来发展的趋势再借助于提示词或技能插件可极大提高个人工作、团队协作效率。因为用代码生成图表可复用、可版本管理、修改成本极低还能直接放进文档和PPT。DiagramsPython生态适合云架构图、系统架构图、服务依赖图特点用Python写架构组件库丰富AWS / GCP / Azure都支持优点图表表达很工程化适合写技术方案和架构设计文档适用人群后端、架构师、云原生开发Mermaid适合流程图、时序图、状态图、类图、甘特图特点语法简单Markdown直接支持很多文档平台都能渲染优点学习成本低上手快写文档必备适用场景README、技术博客、团队文档、需求流程梳理Markmap适合思维导图、知识体系整理、课程笔记特点Markdown一键生成脑图优点写笔记时非常爽结构清晰复盘能力拉满适用场景学习路线、项目拆解、面试知识点整理ASCII Editors字符画流程图适合快速画草图、终端环境下画图特点用ASCII字符画框架图/流程图优点轻量、速度快不依赖复杂工具适用场景临时讨论、技术沟通、写在注释里也能看懂PlantUML适合UML图类图、时序图、用例图等特点用文本描述UML生成规范图形优点严谨、标准化适合企业级开发文档适用人群Java开发、系统设计、需要输出标准UML的团队参考UML入门以及Plant UML工具介绍。Go-Diagrams适合网络拓扑、系统架构图、云组件图特点用Go语言描述架构图优点对Go开发者非常友好可集成到工程里自动生成适用场景Go项目文档、基础设施架构展示选型总结怎么选如果你只是写文档、画流程选Mermaid如果你要画UML标准图选PlantUML如果你做云架构设计选Diagrams如果你爱做笔记复盘选Markmap如果你想快速画草图ASCII Editors如果你是Go开发Go-Diagrams个人建议MermaidMarkmap基本能覆盖日常80%的需求。学会之后你会发现写文档效率直接翻倍。Diagrams官网、基于PythonTypeScript实现的开源GitHub42.7K Star2.7K Fork架构图绘制库无需借助Visio、ProcessOn、Draw.io等图形工具仅通过代码即可快速生成云服务、微服务、Web服务等架构图。其底层依赖Graphviz渲染图像将代码逻辑转化为结构化图形支持AWS、Azure、阿里云、K8s等主流云平台图标。优缺点分析优点是代码化绘图、版本可控、集成开发流程适合程序员快速输出架构图缺点是复杂自定义图形能力较弱依赖Graphviz环境实现图像渲染过度复杂的流程图绘制效率较低。内置大量云厂商图标满足不同场景需求AWSEC2、RDS、S3、Lambda、ELB等Azure虚拟机、SQL数据库、存储等阿里云ECS、RDS、OSS、SLB等KubernetesPod、Service、Ingress、Node等通用组件Client、Server、DB、Nginx、Docker等核心概念Diagram画布定义图表名称、方向、输出格式等Node节点代表架构中的组件服务器、数据库、客户端等Cluster集群用于对节点进行分组形成逻辑区域基础绘图流程导入Diagram与对应资源模块创建Diagram对象设置图表信息定义节点使用符号建立节点间调用关系运行代码自动生成PNG、SVG格式图片实战从PyPI下载Python包pip install diagrams入门案例fromdiagramsimportDiagramfromdiagrams.aws.computeimportEC2fromdiagrams.aws.databaseimportRDSfromdiagrams.aws.networkimportELB# 定义图表名称、方向、输出格式withDiagram(Web 服务架构,showFalse,directionLR):# 定义节点与调用关系ELB(负载均衡)EC2(Web 服务器)RDS(数据库)解读with Diagram(...)创建绘图上下文自动管理资源directionLR表示从左到右绘图也可使用TB从上到下showFalse表示运行后不自动打开图片仅保存节点使用对应云服务图标名称可自定义代码运行成功后会在当前目录生成名为web_服务架构.png的架构图直观展示负载均衡、Web服务器、数据库的调用流程。当架构中存在多个同类组件时可使用Cluster进行分组让图表结构更清晰。fromdiagramsimportDiagram,Clusterfromdiagrams.aws.computeimportEC2fromdiagrams.aws.databaseimportRDS,ElastiCachefromdiagrams.aws.networkimportELBfromdiagrams.aws.storageimportS3withDiagram(复杂 Web 架构,showFalse,directionLR):# 定义客户端clientEC2(用户客户端)# 前端服务集群withCluster(前端服务组):lbELB(负载均衡)servers[EC2(Web 1),EC2(Web 2),EC2(Web 3)]# 数据服务集群withCluster(数据层):dbRDS(主库)cacheElastiCache(Redis缓存)storageS3(对象存储)# 建立调用关系clientlbservers serversdb serverscache serversstorage解读Cluster可将多个节点包裹形成独立视觉区域列表形式可批量定义同类节点简化代码支持一对多、多对一的连接关系自动生成连线微服务基础架构fromdiagramsimportDiagram,Clusterfromdiagrams.onprem.clientimportUserfromdiagrams.onprem.computeimportServerfromdiagrams.onprem.databaseimportPostgreSQLfromdiagrams.onprem.inmemoryimportRedisfromdiagrams.onprem.networkimportNginxfromdiagrams.onprem.queueimportRabbitMQfromdiagrams.onprem.loggingimportELKwithDiagram(微服务架构,showFalse,directionTB):userUser(用户)withCluster(网关层):gatewayNginx(网关服务)withCluster(业务微服务):user_serviceServer(用户服务)order_serviceServer(订单服务)pay_serviceServer(支付服务)withCluster(中间件):mqRabbitMQ(消息队列)cacheRedis(缓存)dbPostgreSQL(数据库)withCluster(日志监控):elkELK(日志系统)usergateway gateway[user_service,order_service,pay_service][user_service,order_service,pay_service]mq[user_service,order_service,pay_service]cache[user_service,order_service,pay_service]db[user_service,order_service,pay_service]elk解读使用onprem系列节点适用于自建机房、私有部署架构清晰划分网关层、业务服务、中间件、监控系统多服务统一调用中间件结构一目了然前后端分离项目fromdiagramsimportDiagramfromdiagrams.onprem.clientimportUserfromdiagrams.onprem.computeimportServerfromdiagrams.onprem.containerimportDockerfromdiagrams.onprem.databaseimportMongoDBfromdiagrams.onprem.networkimportNginxfromdiagrams.programming.languageimportPython,Javascriptfromdiagrams.devopsimportGit,JenkinswithDiagram(前后端分离架构,showFalse):userUser(用户)frontendJavascript(前端 Vue/React)webNginx(Web 服务)backendPython(后端服务)dbMongoDB(数据库)withCluster(DevOps 流程):gitGit(代码仓库)ciJenkins(CI/CD)dockerDocker(容器部署)userfrontendwebbackenddb gitcidockerbackend解读支持编程语言、DevOps工具、容器等通用节点完整展示从用户访问到开发部署的全流程适合前后端分离项目、前端开发、全栈开发场景DockerKubernetes架构fromdiagramsimportDiagram,Clusterfromdiagrams.onprem.clientimportUserfromdiagrams.onprem.containerimportDockerfromdiagrams.k8s.computeimportPod,Deploymentfromdiagrams.k8s.networkimportIngress,Servicefromdiagrams.k8s.clusterimportNodefromdiagrams.onprem.monitoringimportPrometheus,GrafanawithDiagram(K8s 容器架构,showFalse,directionLR):userUser(用户)withCluster(K8s 集群):ingressIngress(入口)svcService(服务)deployDeployment(部署)pods[Pod(Pod 1),Pod(Pod 2)]nodeNode(工作节点)withCluster(监控系统):promPrometheus(监控采集)grafGrafana(可视化)dockerDocker(容器)useringresssvcdeploypodsnode podsdocker podsprom promgraf解读专门提供Kubernetes全套图标适配云原生场景展示Ingress、Service、Deployment、Pod层级关系适合运维、云原生、后端开发人员使用电商平台极简架构fromdiagramsimportDiagram,Clusterfromdiagrams.onprem.clientimportUserfromdiagrams.onprem.networkimportNginxfromdiagrams.onprem.computeimportServerfromdiagrams.onprem.databaseimportMySQLfromdiagrams.onprem.queueimportRabbitMQfromdiagrams.onprem.inmemoryimportRedisfromdiagrams.aws.storageimportS3fromdiagrams.onprem.securityimportVaultwithDiagram(电商平台架构,showFalse):usersUser(用户)withCluster(接入层):lbNginx(负载均衡)withCluster(业务服务):goodsServer(商品服务)orderServer(订单服务)payServer(支付服务)user_srvServer(用户服务)withCluster(数据与中间件):dbMySQL(业务库)redisRedis(缓存)mqRabbitMQ(消息队列)ossS3(图片存储)secretVault(密钥管理)userslb[goods,order,pay,user_srv][goods,order,pay,user_srv][db,redis,mq,oss,secret]解读覆盖电商核心服务用户、商品、订单、支付包含数据库、缓存、消息队列、对象存储、密钥服务结构简洁可直接用于项目介绍与架构说明个人项目/博客系统架构fromdiagramsimportDiagramfromdiagrams.onprem.clientimportUserfromdiagrams.onprem.networkimportNginxfromdiagrams.programming.languageimportPythonfromdiagrams.onprem.databaseimportSQLitefromdiagrams.onprem.hostingimportServerfromdiagrams.devopsimportVercelwithDiagram(个人博客架构,showFalse):userUser(访客)nginxNginx(Web 服务)backendPython(Django/Flask)dbSQLite(轻量数据库)deployVercel(云部署)serverServer(轻量服务器)usernginxbackenddb deployserver serverbackend解读适合个人博客、小型工具、毕业设计项目使用轻量组件部署简单成本低图表清晰适合写在项目README中图表样式配置fromdiagramsimportDiagramfromdiagrams.aws.computeimportEC2withDiagram(自定义样式,showFalse,directionLR,filenamecustom_style,outformatsvg,graph_attr{fontsize:16,bgcolor:white,labeljust:center},node_attr{fontsize:12,shape:box,style:filled}):EC2(自定义节点样式)解读filename指定输出文件名outformat支持PNG、SVG、PDF等格式graph_attr与node_attr可自定义背景、字体、形状、颜色批量节点简化写法fromdiagramsimportDiagramfromdiagrams.aws.computeimportEC2withDiagram(批量节点,showFalse):# 列表快速生成多个节点web_servers[EC2(fWeb{i})foriinrange(1,4)][EC2(入口)]web_servers解读使用列表推导式快速生成多个同类节点适合大规模服务架构减少重复代码D2官网Declarative Diagramming缩写开源GitHub25.6K Star759 Fork、Go实现、现代化的文本生成图表Text-to-Diagram语言开发者通过编写简洁的文本即可自动生成流程图、系统架构图、网络拓扑图、实体关系图、时序图等各种可视化图表。功能类似于 Mermaid、PlantUML但在布局能力、美观度、主题系统和工程化支持方面更加现代化。在线体验直接输入文本即可生成和导出相应的图表。官方文档。功能特性语法简单D2采用声明式语法用户只需使用接近自然语言的文本描述节点和关系即可完成流程图、架构图、数据流图等复杂图表的绘制。丰富的图形提供丰富的内置图形体系涵盖矩形、圆形、菱形、六边形等基础图形以及人物、数据库、云、文档、队列、软件包、SQL表等面向软件架构和数据建模的专业图形。同时还支持通过image图形加载自定义Logo和Icon实现AWS、Azure、SAP、Kubernetes等企业级架构元素的可视化展示。自动布局内置多种布局引擎Dagre、ELK、TALA并具备强大的自动布局能力用户只需定义节点及其关系无需手工调整位置和连线系统即可自动生成结构清晰、美观专业的图表。Markdown支持原生支持Markdown内容嵌入允许在图表中直接添加标题、说明文档、列表、代码片段等富文本信息。代码高亮支持代码高亮展示能够在图表中直接嵌入带语法高亮的代码片段使架构设计与实现代码紧密结合。LaTeX公式支持基于MathJax的数学公式渲染允许用户在图表中直接嵌入复杂的数学表达式、公式和科学符号并且自动生成高质量的可视化展示效果。变量与替换允许用户在图表中定义和复用变量将颜色、样式、名称、配置参数等公共内容集中管理并且在多个位置引用。动画功能能够根据文本描述生成动态演示效果让图表不仅展示静态结构还可以呈现流程演进、状态变化和事件发生过程。专业主题系统提供多种由设计师精心打造的视觉主题用户无需额外设计即可生成美观、统一且适合展示的专业图表。导出格式支持将图表导出为多种主流格式包括SVG、PNG、PDF等静态文件格式以及适用于网页展示的高质量矢量图输出。多语言支持具备优秀的多语言支持能力全面兼容Unicode字符集能够在图表中直接使用中文、英文、日文、韩文、法文以及Emoji等多种字符内容无需额外配置即可正确显示。跨平台使用支持Windows、macOS和Linux等主流操作系统并且提供统一的命令行工具和一致的使用体验。提供在线Playground、VS Code、Obsidian和Vim等编辑器支持。扩展生态除官方提供的插件外还支持通过Python、JavaScript、C#等SDK动态生成图表并可与MkDocs、MdBook、Pandoc等文档系统集成实现图表自动渲染和文档自动化。此外社区还提供PostgreSQL、MySQL、MongoDB到D2的数据库建模工具以及Structurizr到D2的架构模型导出工具能够将D2无缝融入软件开发、系统架构设计、知识管理和DevOps流程中。实战打开官方提供在线演示快速体验功能解读布局引擎Layout Engine支持Dagre、ELK、TALA主题Theme支持Neutral default、Neutral gray、Flagship Terrastruct、Cool classics、Mixed berry blue、Grape soda、Aubergine、Colorblind clear、Vanilla nitro cola、Orange creamsicle、Shirley temple、Earth tones、Everglade green、Buttered toast、Dark mauve、Dark Flagship Terrastruct、Terminal、Terminal grayscale、Origami渲染器Renderer支持SVG、Sketch、ASCII导出Export支持PNG、SVGommoh-my-*系列迎来又一个成员oh-my-mermaid缩写官网开源GitHub2.3K Star197 Fork。oh-my-*系列其他项目oh-my-codexoh-my-pioh-my-opencode类似工具Code2Architecture、Nexus-skills实战基于npm快速安装npm install -g oh-my-mermaid命令行使用示例omm setup配置中文输出omm config language zh执行omm scan命令产出.omm/ ├── overall-architecture/ │ ├── description.md │ ├── diagram.mmd │ ├── context.md │ ├── main-process/ │ │ ├── description.md │ │ └── diagram.mmd │ └── renderer/ ├──>