docs(add):新增Project Caffeine MVP Srint1原型设计说明文档示意图
Signed-off-by: gzkoala <guohao@gitconomy.org>
This commit is contained in:
@@ -0,0 +1,399 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 1200" width="100%" height="100%">
|
||||
<!--
|
||||
================================================================================
|
||||
图表名称:提示词策略 MCP Server 原型架构图 (Prompt Strategy MVP Architecture)
|
||||
文件命名:prompt-strategy-mcp-server-prototype-architecture.svg
|
||||
用途:展示从 Client 请求到 5 Whys 策略引擎、资源层再到大模型推理的“上下层级”完整组件链及执行流。
|
||||
版本:v1.0.0 (Top-Down Layout with 50px Spacing Adjustment)
|
||||
作者:Gitconomy Research-郭晧
|
||||
SPDX-License-Identifier: MIT & CC-BY-SA-4.0
|
||||
创建日期:2026-03-01
|
||||
================================================================================
|
||||
-->
|
||||
|
||||
<!-- Background: Solid White for Git compatibility -->
|
||||
<rect width="100%" height="100%" fill="#FFFFFF" />
|
||||
|
||||
<defs>
|
||||
<style>
|
||||
:root {
|
||||
/* 语义色定义 */
|
||||
--c-cloud-blue: #0099FF;
|
||||
--c-cloud-blue-light: rgba(0, 153, 255, 0.08);
|
||||
--c-local-green: #009900;
|
||||
--c-local-green-light: rgba(0, 153, 0, 0.08);
|
||||
--c-risk-amber: #F97316;
|
||||
--c-risk-amber-light: rgba(249, 115, 22, 0.08);
|
||||
--c-gov-blue: #3B82F6;
|
||||
--c-gov-blue-light: rgba(59, 130, 246, 0.08);
|
||||
--c-neutral-gray: #475569;
|
||||
--c-neutral-gray-light: #E2E8F0;
|
||||
|
||||
/* 步骤高亮色 */
|
||||
--c-step-red: #EF4444;
|
||||
}
|
||||
|
||||
/* 字体降级机制 */
|
||||
.font-sans { font-family: 'Noto Sans', 'Helvetica Neue', Arial, sans-serif; }
|
||||
.font-mono { font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace; }
|
||||
|
||||
/* 文本层级 */
|
||||
.card-title { font-size: 15px; font-weight: bold; fill: #FFFFFF; }
|
||||
.card-text { font-size: 13px; fill: var(--c-neutral-gray); }
|
||||
.text-code { font-size: 13px; font-weight: bold; fill: #0F172A; }
|
||||
.label-text { font-size: 12px; font-weight: bold; fill: var(--c-neutral-gray); }
|
||||
.step-text { font-size: 13px; font-weight: bold; fill: #FFFFFF; }
|
||||
</style>
|
||||
|
||||
<!-- 箭头标记 -->
|
||||
<marker id="arrow-gray" markerWidth="8" markerHeight="8" refX="7" refY="4" orient="auto">
|
||||
<path d="M 0 0 L 8 4 L 0 8 Z" fill="var(--c-neutral-gray)" />
|
||||
</marker>
|
||||
<!-- 返回箭头 (虚线用) -->
|
||||
<marker id="arrow-gray-return" markerWidth="8" markerHeight="8" refX="7" refY="4" orient="auto">
|
||||
<path d="M 0 0 L 8 4 L 0 8 Z" fill="var(--c-neutral-gray)" />
|
||||
</marker>
|
||||
</defs>
|
||||
|
||||
<!--
|
||||
===========================================================================
|
||||
顶层标题块 (Title Block)
|
||||
绝对底部坐标为: 40 + 70 + 3 = 113
|
||||
===========================================================================
|
||||
-->
|
||||
<g id="title-block" transform="translate(640, 40)">
|
||||
<text y="0" text-anchor="middle" class="font-mono" font-size="12" fill="var(--c-neutral-gray)" letter-spacing="1">FIG-01</text>
|
||||
<text y="30" text-anchor="middle" class="font-sans" font-weight="bold" font-size="24" fill="#000000">提示词策略 MCP Server 系统组件工作流架构图</text>
|
||||
<text y="55" text-anchor="middle" class="font-mono" font-size="14" fill="var(--c-neutral-gray)">架构图 > MVP Sprint1 & 系统组件工作流</text>
|
||||
<rect x="-30" y="70" width="60" height="3" fill="var(--c-cloud-blue)" />
|
||||
</g>
|
||||
|
||||
<!--
|
||||
===========================================================================
|
||||
架构图主体内容 (Architecture Diagram Content)
|
||||
通过 translate(0, 73) 平移,使最顶部的 Client Request (原 y=90)
|
||||
新坐标达到 163,从而与标题底部 (113) 保持精确的 50 单位距离。
|
||||
===========================================================================
|
||||
-->
|
||||
<g id="diagram-content" transform="translate(0, 73)">
|
||||
|
||||
<!--
|
||||
===========================================================================
|
||||
物理边界与容器 (Boundaries)
|
||||
===========================================================================
|
||||
-->
|
||||
<g id="boundaries" transform="translate(0, 240)">
|
||||
<!-- Node.js MCP Server Runtime Boundary -->
|
||||
<rect x="280" y="0" width="960" height="550" rx="12" fill="var(--c-local-green-light)" stroke="var(--c-local-green)" stroke-dasharray="4 4" stroke-width="2" />
|
||||
<rect x="280" y="0" width="960" height="36" fill="var(--c-local-green)" opacity="0.1" rx="12"/>
|
||||
<text x="300" y="23" class="font-mono" font-size="14" font-weight="bold" fill="var(--c-local-green)">📦 Node.js MCP Server Runtime (Express.js)</text>
|
||||
</g>
|
||||
|
||||
<!--
|
||||
===========================================================================
|
||||
核心连线与正交路由路径 (Orthogonal Routing)
|
||||
===========================================================================
|
||||
-->
|
||||
<g id="connections" fill="none" stroke="var(--c-neutral-gray)" stroke-width="2">
|
||||
<!-- Client to app.js -->
|
||||
<path d="M 760 220 L 760 272" marker-end="url(#arrow-gray)" />
|
||||
|
||||
<!-- app.js to apiRoutes -->
|
||||
<path d="M 760 340 L 760 375" marker-end="url(#arrow-gray)" />
|
||||
|
||||
<!-- apiRoutes to Controllers -->
|
||||
<path d="M 760 470 L 760 515" marker-end="url(#arrow-gray)" />
|
||||
<path d="M 760 470 L 760 495 L 440 495 L 440 518" marker-end="url(#arrow-gray)" />
|
||||
<path d="M 760 470 L 760 495 L 1080 495 L 1080 518" marker-end="url(#arrow-gray)" />
|
||||
|
||||
<!-- Controllers to Services -->
|
||||
<path d="M 440 580 L 440 632" marker-end="url(#arrow-gray)" />
|
||||
<path d="M 760 580 L 760 632" marker-end="url(#arrow-gray)" />
|
||||
<path d="M 1080 580 L 1080 632" marker-end="url(#arrow-gray)" />
|
||||
|
||||
<!-- Services Cross-talk (Context Injection) -->
|
||||
<path d="M 550 680 L 645 680" stroke-dasharray="4 2" marker-end="url(#arrow-gray)" />
|
||||
<path d="M 970 680 L 875 680" stroke-dasharray="4 2" marker-end="url(#arrow-gray)" />
|
||||
|
||||
<!-- Services to External APIs/Resources -->
|
||||
<path d="M 740 725 L 740 852" marker-end="url(#arrow-gray)" />
|
||||
<path d="M 1080 725 L 1080 855" marker-end="url(#arrow-gray)" />
|
||||
|
||||
<!-- Return Path from LLM API -->
|
||||
<path d="M 780 850 L 780 725" stroke-dasharray="4 4" marker-end="url(#arrow-gray-return)" />
|
||||
|
||||
<!-- config.js to app.js -->
|
||||
<path d="M 490 310 L 682 310" stroke-dasharray="2 2" marker-end="url(#arrow-gray)" />
|
||||
</g>
|
||||
|
||||
<!--
|
||||
===========================================================================
|
||||
路径上的文本标签 (Path Labels)
|
||||
===========================================================================
|
||||
-->
|
||||
<g id="path-labels" class="font-sans label-text">
|
||||
<text x="775" y="255" text-anchor="start">HTTP Request</text>
|
||||
<text x="425" y="605" text-anchor="end">Enquiry</text>
|
||||
<text x="590" y="650" text-anchor="middle">Enhanced</text>
|
||||
<text x="590" y="665" text-anchor="middle">Prompt</text>
|
||||
<text x="930" y="650" text-anchor="middle">Context</text>
|
||||
<text x="930" y="665" text-anchor="middle">Data</text>
|
||||
<text x="725" y="820" text-anchor="end">API Call</text>
|
||||
<text x="795" y="820" text-anchor="start">Response</text>
|
||||
<text x="1095" y="820" text-anchor="start">Fetch / Sync</text>
|
||||
</g>
|
||||
|
||||
<!--
|
||||
===========================================================================
|
||||
节点卡片 (Cards & Nodes)
|
||||
===========================================================================
|
||||
-->
|
||||
<g id="nodes">
|
||||
|
||||
<!-- 1. Client Request Box -->
|
||||
<g transform="translate(640, 90)">
|
||||
<rect x="0" y="0" width="240" height="130" rx="6" fill="#FFFFFF" stroke="var(--c-neutral-gray)" stroke-width="2" />
|
||||
<rect x="0" y="0" width="240" height="30" fill="var(--c-neutral-gray-light)" rx="6"/>
|
||||
<rect x="0" y="20" width="240" height="10" fill="var(--c-neutral-gray-light)"/>
|
||||
<text x="120" y="20" text-anchor="middle" class="font-sans" font-size="14" font-weight="bold" fill="#0F172A">Client Request</text>
|
||||
|
||||
<!-- List -->
|
||||
<text x="15" y="55" class="font-mono text-code">- /api/prompts/query</text>
|
||||
<text x="15" y="75" class="font-mono text-code">- /api/model/infer</text>
|
||||
<text x="15" y="95" class="font-mono text-code">- /api/resources/list</text>
|
||||
<line x1="15" y1="110" x2="225" y2="110" stroke="var(--c-neutral-gray-light)" stroke-dasharray="2 2" />
|
||||
<text x="15" y="123" class="font-sans card-text" font-size="11">Format: JSON-RPC 2.0</text>
|
||||
</g>
|
||||
|
||||
<!-- 2. config.js & .env -->
|
||||
<g transform="translate(310, 280)">
|
||||
<rect x="0" y="0" width="180" height="60" rx="6" fill="#F8FAFC" stroke="var(--c-neutral-gray)" stroke-width="1.5" stroke-dasharray="2 2" />
|
||||
<rect x="0" y="0" width="180" height="26" fill="var(--c-neutral-gray)" rx="6" />
|
||||
<rect x="0" y="20" width="180" height="6" fill="var(--c-neutral-gray)" />
|
||||
<text x="90" y="18" text-anchor="middle" class="font-mono card-title" font-size="13">.env & config.js</text>
|
||||
<text x="90" y="48" text-anchor="middle" class="font-sans card-text">API Keys & Configuration</text>
|
||||
</g>
|
||||
|
||||
<!-- 3. app.js -->
|
||||
<g transform="translate(695, 280)">
|
||||
<rect x="0" y="0" width="130" height="60" rx="6" fill="#FFFFFF" stroke="var(--c-gov-blue)" stroke-width="2" />
|
||||
<rect x="0" y="0" width="130" height="26" fill="var(--c-gov-blue)" rx="6" />
|
||||
<rect x="0" y="20" width="130" height="6" fill="var(--c-gov-blue)" />
|
||||
<text x="65" y="18" text-anchor="middle" class="font-mono card-title">app.js</text>
|
||||
<text x="65" y="48" text-anchor="middle" class="font-sans card-text">Main Gateway</text>
|
||||
</g>
|
||||
|
||||
<!-- 4. apiRoutes.js -->
|
||||
<g transform="translate(670, 380)">
|
||||
<rect x="0" y="0" width="180" height="90" rx="6" fill="#FFFFFF" stroke="var(--c-gov-blue)" stroke-width="2" />
|
||||
<rect x="0" y="0" width="180" height="26" fill="var(--c-gov-blue)" rx="6" />
|
||||
<rect x="0" y="20" width="180" height="6" fill="var(--c-gov-blue)" />
|
||||
<text x="90" y="18" text-anchor="middle" class="font-mono card-title">apiRoutes.js</text>
|
||||
<text x="90" y="45" text-anchor="middle" class="font-sans card-text">API Router Node</text>
|
||||
<line x1="20" y1="55" x2="160" y2="55" stroke="var(--c-neutral-gray-light)" stroke-width="1.5" />
|
||||
<text x="90" y="75" text-anchor="middle" class="font-mono card-text" font-size="11">Express Router()</text>
|
||||
</g>
|
||||
|
||||
<!-- 5. promptsController.js -->
|
||||
<g transform="translate(340, 520)">
|
||||
<rect x="0" y="0" width="200" height="60" rx="6" fill="#FFFFFF" stroke="var(--c-risk-amber)" stroke-width="2" />
|
||||
<rect x="0" y="0" width="200" height="26" fill="var(--c-risk-amber)" rx="6" />
|
||||
<rect x="0" y="20" width="200" height="6" fill="var(--c-risk-amber)" />
|
||||
<text x="100" y="18" text-anchor="middle" class="font-mono card-title">promptsController.js</text>
|
||||
<text x="100" y="48" text-anchor="middle" class="font-sans card-text">查询与提示词请求分发</text>
|
||||
</g>
|
||||
|
||||
<!-- 6. modelController.js -->
|
||||
<g transform="translate(660, 520)">
|
||||
<rect x="0" y="0" width="200" height="60" rx="6" fill="#FFFFFF" stroke="var(--c-risk-amber)" stroke-width="2" />
|
||||
<rect x="0" y="0" width="200" height="26" fill="var(--c-risk-amber)" rx="6" />
|
||||
<rect x="0" y="20" width="200" height="6" fill="var(--c-risk-amber)" />
|
||||
<text x="100" y="18" text-anchor="middle" class="font-mono card-title">modelController.js</text>
|
||||
<text x="100" y="48" text-anchor="middle" class="font-sans card-text">多步推理请求分发</text>
|
||||
</g>
|
||||
|
||||
<!-- 7. resourcesController.js -->
|
||||
<g transform="translate(980, 520)">
|
||||
<rect x="0" y="0" width="200" height="60" rx="6" fill="#FFFFFF" stroke="var(--c-risk-amber)" stroke-width="2" />
|
||||
<rect x="0" y="0" width="200" height="26" fill="var(--c-risk-amber)" rx="6" />
|
||||
<rect x="0" y="20" width="200" height="6" fill="var(--c-risk-amber)" />
|
||||
<text x="100" y="18" text-anchor="middle" class="font-mono card-title">resourcesController.js</text>
|
||||
<text x="100" y="48" text-anchor="middle" class="font-sans card-text">资源获取与管理分发</text>
|
||||
</g>
|
||||
|
||||
<!-- 8. promptService.js -->
|
||||
<g transform="translate(330, 640)">
|
||||
<rect x="0" y="0" width="220" height="85" rx="6" fill="#FFFFFF" stroke="var(--c-local-green)" stroke-width="2" />
|
||||
<rect x="0" y="0" width="220" height="26" fill="var(--c-local-green)" rx="6" />
|
||||
<rect x="0" y="20" width="220" height="6" fill="var(--c-local-green)" />
|
||||
<text x="110" y="18" text-anchor="middle" class="font-mono card-title">promptService.js</text>
|
||||
<rect x="15" y="35" width="190" height="20" rx="3" fill="var(--c-risk-amber-light)" />
|
||||
<text x="110" y="50" text-anchor="middle" class="font-sans text-code" fill="var(--c-risk-amber)">核心: 5 Whys 模板分解引擎</text>
|
||||
<text x="110" y="70" text-anchor="middle" class="font-sans card-text">输出: 增强合成提示词</text>
|
||||
</g>
|
||||
|
||||
<!-- 9. inferenceService.js -->
|
||||
<g transform="translate(650, 640)">
|
||||
<rect x="0" y="0" width="220" height="85" rx="6" fill="#FFFFFF" stroke="var(--c-local-green)" stroke-width="2" />
|
||||
<rect x="0" y="0" width="220" height="26" fill="var(--c-local-green)" rx="6" />
|
||||
<rect x="0" y="20" width="220" height="6" fill="var(--c-local-green)" />
|
||||
<text x="110" y="18" text-anchor="middle" class="font-mono card-title">inferenceService.js</text>
|
||||
<text x="110" y="50" text-anchor="middle" class="font-sans text-code">大语言模型交互管理</text>
|
||||
<text x="110" y="70" text-anchor="middle" class="font-sans card-text">上下文注入与结果格式化</text>
|
||||
</g>
|
||||
|
||||
<!-- 10. resourceService.js -->
|
||||
<g transform="translate(970, 640)">
|
||||
<rect x="0" y="0" width="220" height="85" rx="6" fill="#FFFFFF" stroke="var(--c-local-green)" stroke-width="2" />
|
||||
<rect x="0" y="0" width="220" height="26" fill="var(--c-local-green)" rx="6" />
|
||||
<rect x="0" y="20" width="220" height="6" fill="var(--c-local-green)" />
|
||||
<text x="110" y="18" text-anchor="middle" class="font-mono card-title">resourceService.js</text>
|
||||
<text x="110" y="50" text-anchor="middle" class="font-sans text-code">管理学术DB、PDF等</text>
|
||||
<text x="110" y="70" text-anchor="middle" class="font-sans card-text">提供推理上下文数据</text>
|
||||
</g>
|
||||
|
||||
<!-- 11. LLM API (Hexagon) -->
|
||||
<g transform="translate(760, 900)">
|
||||
<polygon points="0,-40 50,-20 50,20 0,40 -50,20 -50,-20" fill="var(--c-cloud-blue-light)" stroke="var(--c-cloud-blue)" stroke-width="3" />
|
||||
<text x="0" y="-5" text-anchor="middle" class="font-nono card-text" fill="var(--c-cloud-blue)" font-size="16">LLM API</text>
|
||||
<text x="0" y="15" text-anchor="middle" class="font-mono card-text" font-size="11" fill="var(--c-cloud-blue)">(Model)</text>
|
||||
</g>
|
||||
|
||||
<!-- 12. External Resources (Cylinder) -->
|
||||
<g transform="translate(980, 865)">
|
||||
<!-- Cylinder Body -->
|
||||
<path d="M 0 15 A 100 20 0 1 0 200 15 V 75 A 100 20 0 1 1 0 75 Z" fill="var(--c-cloud-blue-light)" stroke="var(--c-cloud-blue)" stroke-width="2" />
|
||||
<!-- Cylinder Top -->
|
||||
<ellipse cx="100" cy="15" rx="100" ry="20" fill="var(--c-cloud-blue-light)" stroke="var(--c-cloud-blue)" stroke-width="2" />
|
||||
<text x="100" y="50" text-anchor="middle" class="font-sans card-title" fill="var(--c-cloud-blue)" font-size="14">资源与知识库 (Resources)</text>
|
||||
<text x="100" y="70" text-anchor="middle" class="font-sans card-text" fill="var(--c-cloud-blue)" font-size="12">学术DB / PDF / Obsidian</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!--
|
||||
===========================================================================
|
||||
MVP 执行步骤气泡与侧边栏 (MVP Execution Flow Steps)
|
||||
===========================================================================
|
||||
-->
|
||||
<g id="execution-steps">
|
||||
|
||||
<!-- Step 1: Client to Server -->
|
||||
<g transform="translate(760, 246)">
|
||||
<circle cx="0" cy="0" r="10" fill="var(--c-step-red)" />
|
||||
<text x="0" y="4.5" text-anchor="middle" class="font-sans step-text">1</text>
|
||||
</g>
|
||||
|
||||
<!-- Step 2: 5 Whys Decomposition -->
|
||||
<g transform="translate(440, 600)">
|
||||
<circle cx="0" cy="0" r="10" fill="var(--c-step-red)" />
|
||||
<text x="0" y="4.5" text-anchor="middle" class="font-sans step-text">2</text>
|
||||
</g>
|
||||
|
||||
<!-- Step 3: Fetch Context from Resources -->
|
||||
<g transform="translate(930, 680)">
|
||||
<circle cx="0" cy="0" r="10" fill="var(--c-step-red)" />
|
||||
<text x="0" y="4.5" text-anchor="middle" class="font-sans step-text">3</text>
|
||||
</g>
|
||||
|
||||
<!-- Step 4: Assemble Enhanced Prompt -->
|
||||
<g transform="translate(590, 680)">
|
||||
<circle cx="0" cy="0" r="10" fill="var(--c-step-red)" />
|
||||
<text x="0" y="4.5" text-anchor="middle" class="font-sans step-text">4</text>
|
||||
</g>
|
||||
|
||||
<!-- Step 5: Inference Request -->
|
||||
<g transform="translate(740, 815)">
|
||||
<circle cx="0" cy="0" r="10" fill="var(--c-step-red)" />
|
||||
<text x="0" y="4.5" text-anchor="middle" class="font-sans step-text">5</text>
|
||||
</g>
|
||||
|
||||
<!-- Step 6: Return Result -->
|
||||
<g transform="translate(780, 815)">
|
||||
<circle cx="0" cy="0" r="10" fill="var(--c-step-red)" />
|
||||
<text x="0" y="4.5" text-anchor="middle" class="font-sans step-text">6</text>
|
||||
</g>
|
||||
|
||||
<!-- Flow Legend Box (Left Side) -->
|
||||
<g transform="translate(20, 360)">
|
||||
<rect x="0" y="0" width="240" height="180" rx="8" fill="#FEF2F2" stroke="var(--c-step-red)" stroke-width="1.5" />
|
||||
<text x="120" y="25" text-anchor="middle" class="font-sans" font-size="14" font-weight="bold" fill="var(--c-step-red)">MVP 核心执行步骤流</text>
|
||||
<line x1="15" y1="35" x2="225" y2="35" stroke="var(--c-step-red)" stroke-dasharray="2 2" />
|
||||
|
||||
<!-- List Items -->
|
||||
<g transform="translate(15, 55)">
|
||||
<circle cx="6" cy="-4" r="6" fill="var(--c-step-red)" />
|
||||
<text x="6" y="0" text-anchor="middle" class="font-sans step-text" font-size="9">1</text>
|
||||
<text x="18" y="0" class="font-sans card-text" fill="#000000">接收初始查询与资源请求</text>
|
||||
</g>
|
||||
<g transform="translate(15, 75)">
|
||||
<circle cx="6" cy="-4" r="6" fill="var(--c-step-red)" />
|
||||
<text x="6" y="0" text-anchor="middle" class="font-sans step-text" font-size="9">2</text>
|
||||
<text x="18" y="0" class="font-sans card-text" fill="#000000">5 Whys 深度模板分解</text>
|
||||
</g>
|
||||
<g transform="translate(15, 95)">
|
||||
<circle cx="6" cy="-4" r="6" fill="var(--c-step-red)" />
|
||||
<text x="6" y="0" text-anchor="middle" class="font-sans step-text" font-size="9">3</text>
|
||||
<text x="18" y="0" class="font-sans card-text" fill="#000000">提取外部资源与本地知识</text>
|
||||
</g>
|
||||
<g transform="translate(15, 115)">
|
||||
<circle cx="6" cy="-4" r="6" fill="var(--c-step-red)" />
|
||||
<text x="6" y="0" text-anchor="middle" class="font-sans step-text" font-size="9">4</text>
|
||||
<text x="18" y="0" class="font-sans card-text" fill="#000000">注入上下文生成合成提示词</text>
|
||||
</g>
|
||||
<g transform="translate(15, 135)">
|
||||
<circle cx="6" cy="-4" r="6" fill="var(--c-step-red)" />
|
||||
<text x="6" y="0" text-anchor="middle" class="font-sans step-text" font-size="9">5</text>
|
||||
<text x="18" y="0" class="font-sans card-text" fill="#000000">发起大模型多步推理</text>
|
||||
</g>
|
||||
<g transform="translate(15, 155)">
|
||||
<circle cx="6" cy="-4" r="6" fill="var(--c-step-red)" />
|
||||
<text x="6" y="0" text-anchor="middle" class="font-sans step-text" font-size="9">6</text>
|
||||
<text x="18" y="0" class="font-sans card-text" fill="#000000">组装并返回深度研究结果</text>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!--
|
||||
===========================================================================
|
||||
底部图例与注释块 (Legend & Key Block)
|
||||
===========================================================================
|
||||
-->
|
||||
<g id="legend" transform="translate(640, 1100)">
|
||||
<rect x="-440" y="-16" width="880" height="40" rx="4" fill="rgba(255, 255, 255, 0.9)" stroke="var(--c-neutral-gray)" stroke-width="0.5"/>
|
||||
|
||||
<g transform="translate(-420, 0)">
|
||||
<text x="0" y="8" class="font-sans" font-size="13" font-weight="bold" fill="var(--c-neutral-gray)">组件与语义对照:</text>
|
||||
|
||||
<g transform="translate(130, 0)">
|
||||
<rect x="-6" y="-6" width="12" height="12" rx="2" fill="var(--c-gov-blue)" />
|
||||
<text x="12" y="8" class="font-sans" font-size="12" fill="var(--c-neutral-gray)">基础架构与路由网关</text>
|
||||
</g>
|
||||
|
||||
<g transform="translate(290, 0)">
|
||||
<rect x="-6" y="-6" width="12" height="12" rx="2" fill="var(--c-risk-amber)" />
|
||||
<text x="12" y="8" class="font-sans" font-size="12" fill="var(--c-neutral-gray)">请求分发与控制器</text>
|
||||
</g>
|
||||
|
||||
<g transform="translate(450, 0)">
|
||||
<rect x="-6" y="-6" width="12" height="12" rx="2" fill="var(--c-local-green)" />
|
||||
<text x="12" y="8" class="font-sans" font-size="12" fill="var(--c-neutral-gray)">核心策略与业务逻辑</text>
|
||||
</g>
|
||||
|
||||
<g transform="translate(610, 0)">
|
||||
<rect x="-6" y="-6" width="12" height="12" rx="2" fill="var(--c-cloud-blue)" />
|
||||
<text x="12" y="8" class="font-sans" font-size="12" fill="var(--c-neutral-gray)">远端第三方 AI 与资源</text>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!--
|
||||
===========================================================================
|
||||
底部许可声明
|
||||
===========================================================================
|
||||
-->
|
||||
<text x="640" y="1160" text-anchor="middle" class="font-sans" font-size="11" fill="var(--c-neutral-gray)">
|
||||
本作品采用 CC-BY-SA 4.0 进行许可,© 2025-2026 Gitconomy Research社区
|
||||
</text>
|
||||
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 22 KiB |
Reference in New Issue
Block a user