敲黑板：必须生成可以编辑的流程图，Claude 生成的 HTML 很好看，但是我改起来太难受，不考虑。
既然drawio是开源的，那么肯定有 drawio 的 MCP 服务器，一搜果然有，然后很快安装上让制作出的 Drawio Agent 完成了讲解大模型的流程图的绘制： 接下来就分享一下如何使用同款效果吧！
安装 Drawio MCP1. 下载 OpenMCP先下载 openmcp，根据这里的教程： 获取 OpenMCP | OpenMCP.
2. 添加 Drawio MCP 服务器然后打开 openmcp 的控制面板，点击 + 添加：
选择 STDIO，然后命令填入 npx -y drawio-mcp-server，工作目录留空就行。
.
3. 启动 Drawio MCP 服务器然后点击这里启动：
启动后，openmcp 会自动去连结 Drawio MCP 服务器，显示连接成功就没问题了：
.4. 安装 drawio 浏览器插件并准备绘画环境打开插件，如果显示 connected 代表连接成功：
5. 开始玩耍！回到 openmcp，打开一个交互测试窗口，询问如下的问题：
我现在向大模型输入“今天还没吃饭，现在好”，大模型输出一个向量代表 logits，然后选中其中数值最大的一个，备选单词有“饿”，还有很多其他的，你需要帮我生成一个绘制当前场景的 html，表示一下这个逻辑，选择了logits最大的那个，然后那个单词是“饿”，然后拼接到上面的句子中。你需要创建 logits 和每一个token单词，把它们放在一个方块内。请使用从左到右的布局风格来绘制。
过一会，就能看到结果了： 感觉不太好看，我更喜欢 logits 颜色保持一致，我们继续把需求仍给 AI： 这下的效果就完美了： 最后，觉得好用的话，不要忘记给 OpenMCP 点个 star ： GitHub - LSTM-Kirigaya/openmcp-client: All in one vscode plugin for mcp developer
| 
微信登陆 
