ARTICLE DETAIL

建站实战干货

来自一线的建站与推广经验沉淀,每一条都经过真实交付验证。

next-ai-draw-io 液压与气动符号库(fluidpower)接入参考:mxgraph.fluid_power 图形风格、247 个形状清单与 AI 生成集成

2026/9/9 23:54:35 拓冰建站 浏览量
next-ai-draw-io 液压与气动符号库(fluidpower)接入参考:mxgraph.fluid_power 图形风格、247 个形状清单与 AI 生成集成 next-ai-draw-io 液压与气动符号库fluidpower接入参考mxgraph.fluid_power 图形风格、247 个形状清单与 AI 生成集成【免费下载链接】next-ai-draw-ioA next.js web application that integrates AI capabilities with draw.io diagrams. This app allows you to create, modify, and enhance diagrams through natural language commands and AI-assisted visualization.项目地址: https://gitcode.com/GitHub_Trending/ne/next-ai-draw-io本指南围绕 fluidpower.md 展开介绍 next-ai-draw-io 内置的液压/气动工程符号库它属于 draw.io 的 mxgraph 形状体系以mxgraph.fluid_power为统一前缀为 AI 自然语言生成液压原理图、气动回路图等工程图提供可直接引用的样式与形状名。读完本文你将掌握该库的完整用法XML 语法、247 条形状名称、在整页 draw.io XML 中的嵌套规则以及 AI 侧通过get_shape_library工具在运行时加载这份参考文档的底层调用链对应 app/api/chat/route.ts 的实现。一、文档定位fluidpower 是工程图纸素材库之一在 next-ai-draw-io 中绘制画布基于 draw.io 的 XML/样式体系而各类专业符号云厂商图标、网络设备、电气元件、液压符号等被组织在 docs/shape-libraries 目录下作为“可被 AI 查询的形状字典”。总览见 docs/shape-libraries/README.md其中 fluidpower 被归类在Engineering工程分组的表格中库名形状数前缀说明文档fluidpower246mxgraph.fluid_powerHydraulic/pneumatic engineering symbolsfluidpower.md需要特别指出README 汇总表记录为246 个形状而 fluidpower.md 头部标题写的是Shapes (247)。差异的原因是文档的 247 条列表把“库本身的根入口mxgraph.fluid_power”也算作第 1 条其后跟随 246 条形如x10010、x10020的实际图形条目经统计以x开头的条目恰好 246 条且无重复。下文统称“246 个具体图形符号 1 个库根符号”。二、基本规格Type 与 Prefixfluidpower 库的核心规格如下它决定了该库所有图形的style书写方式Type形状类型mxgraph shapes——即这些图形并非rounded1、ellipse之类的内置几何形状而是 draw.io/mxgraph 注册的扩展渲染形状必须通过shapemxgraph.xxx.yyy才能触发对应的矢量渲染逻辑。Prefix统一前缀mxgraph.fluid_power——库内每个图形的完整样式名 前缀 具体图形名如mxgraph.fluid_power.x10010。也就是说只要在样式字符串中出现以mxgraph.fluid_power.开头的shapedraw.io 渲染引擎就会加载流体动力符号的绘制代码来绘制该单元格。三、XML 用法模板与逐字段拆解文档给出的标准用法模板如下mxCell valuelabel styleshapemxgraph.fluid_power.{shape};fillColorstrokeColor; vertex1 parent1 mxGeometry x0 y0 width60 height60 asgeometry / /mxCell把它落地到真实形状例如x10010就是mxCell id2 valuePump styleshapemxgraph.fluid_power.x10010;fillColor#dae8fc;strokeColor#6c8ebf; vertex1 parent1 mxGeometry x120 y80 width60 height60 asgeometry / /mxCell模板中的关键字段作用如下value单元格显示的文字标签示例中的label是占位可按需替换为空串或元件描述文字。style核心是shapemxgraph.fluid_power.{shape}其中{shape}用第四节清单中的形状名如x10010、x12170替换。文档模板保留了fillColorstrokeColor;的字样它表示颜色区通常与描边色联动或可统一替换实际使用时建议像上面的示例一样为fillColor与strokeColor显式指定 draw.io 颜色值例如以浅色填充区分泵/阀/缸等不同回路元件。vertex1声明该mxCell是一个图形顶点形状而不是连线。parent1父容器为默认图层单元格。mxGeometryx/y为左上角坐标width/height为宽高。文档示例默认使用60×60的正方形包围盒这也是多数液压符号的较合适初始尺寸可按需要调整例如细长阀件可拉宽为80×40。补充说明mxCell、mxGeometry的完整语义、连线edge1、source/target以及style语法可进一步参考项目的 XML 指南。fluidpower 文档本身只给出符号的形状名与基础用法每个编号对应的图形外观由 draw.io/mxgraph 运行时按mxgraph.fluid_power.*定义解析渲染仓库中的这份 md 仅作为名称/样式清单供 AI 与开发者检索引用。四、嵌入整页 draw.io XML 的规范单独一个符号单元格并不构成可渲染的图纸还需要外层容器。依据 app/api/chat/xml_guide.md 的约束一个可用的最小页面结构为mxfile diagram nameFluid-Power-Circuit mxGraphModel dx1 dy1 grid1 gridSize10 guides1 tooltips1 connect1 arrows1 fold1 page1 pageScale1 pageWidth850 pageHeight1100 math0 shadow0 root mxCell id0 / mxCell id1 parent0 / !-- 液压符号从此处开始id 从 2 起 -- mxCell id2 valueP1 styleshapemxgraph.fluid_power.x10010;fillColor#dae8fc;strokeColor#6c8ebf; vertex1 parent1 mxGeometry x120 y120 width60 height60 asgeometry / /mxCell mxCell id3 valueV styleshapemxgraph.fluid_power.x12160_simplified;fillColor#fff2cc;strokeColor#d6b656; vertex1 parent1 mxGeometry x120 y240 width60 height60 asgeometry / /mxCell !-- 用连线把泵与阀连接 -- mxCell id4 styleedgeStyleorthogonalEdgeStyle;endArrowclassic;html1;rounded0; edge1 parent1 source2 target3 mxGeometry relative1 asgeometry / /mxCell /root /mxGraphModel /diagram /mxfile两条必须遵守的硬性规则同样来自 app/api/chat/xml_guide.md只需提供业务mxCell根容器id0、默认图层id1通常由项目自动补全自定义 id 请从2起。所有mxCell必须是同级兄弟节点严禁把符号mxCell嵌套进另一个mxCell内部连线edge也不要嵌进符号里。五、命名规律从 x10010 到 x12430文档明确指出 “Shapes are named like x10010, x10020, etc.”。观察全部 246 条名称可得出如下编号特征属从名称结构得出的推断名称统一采用x 5 位数字且大多按10 步进排列如x10010 → x10020说明该库使用“编号段”对液压/气动符号家族做机器可读编码。按“百位段”可自然划分为x10xxx、x11xxx、x12xxx三大组大体对应不同的元件功能族。注意仓库中的这份文档只提供名称不提供逐条编号与符号图形的对应图例若需确认某个编号的最终外观应依据 draw.io 运行时的 mxgraph 渲染结果或实际拖入画布后预览。存在个别非规则编号与同名变体x10440/x10441/x10442同组内派生编号一个组件族含三个相近符号x12160_detailed与x12160_simplified同一个组件提供详细版/简化版两套外观写样式时需带后缀即shapemxgraph.fluid_power.x12160_detailed或...x12160_simplified。六、完整形状清单247 条含库根条目以下为 fluidpower.md 中的完整清单原文级复刻供 AI 生成、人工核对与二次开发使用。第 1 条mxgraph.fluid_power是库根入口用于从库中弹出整个符号面板其余 246 条均可直接作为shape的后缀使用。6.1 库根条目mxgraph.fluid_power6.2 x10xxx 段x10010 – x11000x10010 x10020 x10030 x10040 x10050 x10060 x10070 x10080 x10090 x10100 x10110 x10120 x10130 x10140 x10150 x10160 x10170 x10180 x10190 x10200 x10210 x10220 x10230 x10240 x10250 x10260 x10270 x10280 x10290 x10300 x10310 x10320 x10330 x10340 x10350 x10360 x10370 x10380 x10390 x10400 x10410 x10420 x10430 x10440 x10441 x10442 x10450 x10460 x10470 x10480 x10490 x10500 x10510 x10520 x10530 x10540 x10550 x10560 x10570 x10580 x10590 x10600 x10610 x10620 x10630 x10640 x10650 x10660 x10670 x10680 x10690 x10700 x10710 x10720 x10730 x10740 x10750 x10760 x10770 x10780 x10790 x10800 x10810 x10820 x10830 x10840 x10850 x10860 x10870 x10880 x10890 x10900 x10910 x10920 x10930 x10940 x10950 x10960 x10970 x10980 x10990 x110006.3 x11xxx 段x11010 – x11990x11010 x11020 x11030 x11040 x11050 x11060 x11070 x11080 x11090 x11100 x11110 x11120 x11130 x11140 x11150 x11160 x11170 x11180 x11190 x11200 x11210 x11220 x11230 x11240 x11250 x11260 x11270 x11280 x11290 x11300 x11310 x11320 x11330 x11340 x11350 x11360 x11370 x11380 x11390 x11400 x11410 x11420 x11430 x11440 x11450 x11460 x11470 x11480 x11490 x11500 x11510 x11520 x11530 x11540 x11550 x11560 x11570 x11580 x11590 x11600 x11610 x11620 x11630 x11640 x11650 x11660 x11670 x11680 x11690 x11700 x11710 x11720 x11730 x11740 x11750 x11760 x11770 x11780 x11790 x11800 x11810 x11820 x11830 x11840 x11850 x11860 x11870 x11880 x11890 x11900 x11910 x11920 x11930 x11940 x11950 x11960 x11970 x11980 x119906.4 x12xxx 段x12000 – x12430x12000 x12010 x12020 x12030 x12040 x12050 x12060 x12070 x12080 x12090 x12100 x12110 x12120 x12130 x12140 x12150 x12160_detailed x12160_simplified x12170 x12180 x12190 x12200 x12210 x12220 x12230 x12240 x12250 x12260 x12270 x12280 x12290 x12300 x12310 x12320 x12330 x12340 x12350 x12360 x12370 x12380 x12390 x12400 x12410 x12420 x12430七、AI 侧调用链get_shape_library 如何加载 fluidpower.md这篇参考文档不只是给人看的在 AI 生成图表时它会被作为“工具查询”的实时内容注入模型上下文。核心实现在 app/api/chat/route.ts 的get_shape_library工具库的归类工具描述把 28 个可用库按域分组其中工程域被声明为Engineering: fluidpower, electrical, pid, cabinets, floorplan。模型需要液压/气动符号时会以library: fluidpower调用本工具。库名清洗入参先toLowerCase()再用正则/[^a-z0-9_-]/g剔除所有非法字符若清洗后与原始小写名称不一致直接返回非法提示从入口上杜绝路径穿越。路径拼接与二次校验baseDir指向docs/shape-libraries拼接出${library}.md后通过path.resolvestartsWith再次确认解析路径仍落在baseDir内防止../逃逸读取任意文件。读取并返回fs.readFile读出 md 全文返回给模型若文件不存在ENOENT工具会返回可用库清单其中明确包含fluidpowerLibrary fluidpower not found. Available: ... fluidpower, electrical, pid, ...。也就是说模型在回答“帮我画一个液压回路”这类需求时可先调用get_shape_library(libraryfluidpower)获得本文所整理的清单与语法再通过display_diagram/append_diagram等工具输出前几节那样的完整 XML实现“先查字典、再落笔画图”的流程。八、常见误用排查形状不渲染但普通矩形正常检查shape值是否完整等于mxgraph.fluid_power. 第六节清单中的名称含_detailed/_simplified后缀漏掉mxgraph.fluid_power.前缀是最常见原因。AI 反馈“Library not found”库名必须是小写fluidpower工具端会清洗非法字符并强制小写传入FluidPower等大小写或空格都会被拦截。符号方向/比例不对符号外观由 mxgraph 渲染器按固定矢量绘制请通过mxGeometry调整尺寸或对单元格做几何翻转不要试图修改shape名称来改变方向名称是符号族编码而非方向参数。编号与符号对不上仓库文档只保证名称与编号的存在性具体图形语义以实际渲染预览为准编码某个具体元件前建议先在画布上验证一次目标编号。综上fluidpower 库为液压/气动类工程图提供了 246 个开箱即用的 draw.io 符号配合 README 总览、XML 语法指南 与 AI 侧 get_shape_library 工具即可在 next-ai-draw-io 中稳定、可控地生成专业流体动力图纸。【免费下载链接】next-ai-draw-ioA next.js web application that integrates AI capabilities with draw.io diagrams. This app allows you to create, modify, and enhance diagrams through natural language commands and AI-assisted visualization.项目地址: https://gitcode.com/GitHub_Trending/ne/next-ai-draw-io创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考