核心内容摘要
LeagueAkari：本地化英雄联盟辅助工具的技术革新与实践
一简介在软件工程领域“一图胜千言”是永恒的真理。
随着 LLM大语言模型的爆发我们习惯了让 AI 解释代码、重构逻辑甚至直接生成 Mermaid 流程图对于复杂的逻辑生成的Mermaid 流程图有明显的缺点表现力贫乏复杂的嵌套关系如 Swimlanes 内的 Containers变成了扁平的方块无法体现架构的层次感。
布局失控连线像乱麻一样纠缠节点重叠完全没法放在技术评审文档里。
不可编辑的“死图”这是最致命的。
如果你想微调一个模块的位置或者换一种颜色来表示状态你只有两个选择改 Prompt 抽奖祈祷 AI 下一次能理解你的布局要求通常会越改越乱。
重头再来放弃 AI 的成果打开 Visio 或 Draw.io 从零开始画。
这就是AI 生成图形的最后一公里问题AI 可以生成逻辑正确的“图”但无法交付符合工程标准的、可维护的“设计资产”。
要解决这个问题我们需要改变 AI 的产出模式不生成像素也不生成简单的 DSL如 Mermaid而是直接生成工程源文件这就是 Next AI Draw.io MCP 的核心理念。
通过 Model Context Protocol (MCP) 协议我们将 IDE 与专业的绘图工具Draw.io连接起来AI 不再是一个只会画草图的助手它变成了一个能够直接操作 mxGraphModelDraw.io 的核心数据结构的架构师这种模式带来了三个质的飞跃原生可编辑 (Editable by Design)AI 生成的不再是图片而是 XML 源文件。
你可以直接在浏览器里拖拽节点、修改连线、调整配色。
AI 负责 90% 的逻辑梳理和初稿绘制人类负责最后 10% 的审美微调。
结构化映射利用 Draw.io 强大的容器Container和泳道Swimlane功能我们可以将复杂的代码逻辑如状态管理、渲染层级、运行时环境完美映射到图形中这是简单 Markdown 图表无法做到的。
实时反馈闭环代码的变动可以即时反映在架构图中让文档不再是滞后的“死文档”而是随着代码演进的“活资产”。
https://github.com/DayuanJiang/next-ai-draw-iohttps://next-ai-drawio.jiang.jp/zh二Cursor配置MCP{mcpServers:{drawio:{command:npx,args:[next-ai-drawio/mcp-serverlatest]}}}三使用MCPPromt分析SerPackOrderConsumer、PushSapMiOraApi#createSapData、PushSapMiOraApi#pushByTypes这三个步骤的逻辑并使用drawio mcp 绘制出来流程图drawio mcp会分析代码逻辑自动打开浏览器的本地Next AI Draw.io应用然后在上面绘制流程图也可以下载该流程图。
使用drawio mcp绘制的图十分的精美。
drawio本质是xml我们可以在此基础上调整一下格式使得更加美观。
下载Download导入飞书文档先在文档中添加一个新的画板-流程图然后点进去… 导入。
虽然导入后宽度上有些改变但是稍微调整一下很快就好要比自己一点一点画快的多。
四