| 1 | <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720" |
| 2 | font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif" |
| 3 | font-size="12"> |
| 4 | <!-- |
| 5 | Layered Architecture Chart Template |
| 6 | Usage: System/software layered architecture visualization |
| 7 | Scenarios: Technical architecture overview, layer responsibilities, vertical dependencies |
| 8 | Supports: 3 Main Layers + Left Labels + Right Capability Output + Bottom Foundation |
| 9 | --> |
| 10 | <!-- Background --> |
| 11 | <rect width="1280" height="720" fill="#F8FAFC"/> |
| 12 | <!-- Title Area --> |
| 13 | <g id="header" data-pptx-bounds="40 32 850 66"> |
| 14 | <rect x="40" y="32" width="8" height="36" rx="4" fill="#3B82F6"/> |
| 15 | <text x="64" y="60" font-size="32" font-weight="800" fill="#0F172A">Enterprise Layered Architecture</text> |
| 16 | <!-- Subtitle Band --> |
| 17 | <text x="64" y="90" font-size="14" font-weight="600" fill="#64748B" letter-spacing="0.5"> |
| 18 | THREE-TIER CAPABILITY STACK WITH UNIFIED OUTPUT AND SHARED FOUNDATIONAL INFRASTRUCTURE |
| 19 | </text> |
| 20 | </g> |
| 21 | <!-- ==================== Layer 1: App Layer ==================== --> |
| 22 | <g id="app-layer" data-pptx-bounds="40 140 1006 140"> |
| 23 | <rect x="40" y="140" width="40" height="140" rx="8" fill="#3B82F6"/> |
| 24 | <text x="60" y="218" text-anchor="middle" font-size="22" font-weight="800" fill="#FFFFFF">01</text> |
| 25 | <rect x="96" y="140" width="950" height="140" rx="12" fill="#EFF6FF" fill-opacity="0.6" stroke="#93C5FD" stroke-width="1.5" stroke-dasharray="6 4"/> |
| 26 | <text x="571" y="166" text-anchor="middle" font-size="13" font-weight="700" fill="#2563EB" letter-spacing="1">APP LAYER · USER INTERFACES & EXTERNAL ACCESS POINTS</text> |
| 27 | <!-- Card 1.1 --> |
| 28 | <g id="app-web-console-card"> |
| 29 | <rect x="114" y="184" width="220" height="82" rx="8" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 30 | <rect x="126" y="198" width="36" height="36" rx="8" fill="#EFF6FF"/> |
| 31 | <text x="144" y="222" text-anchor="middle" font-size="16" font-weight="800" fill="#3B82F6">W</text> |
| 32 | <text x="174" y="214" font-size="15" font-weight="700" fill="#0F172A">Web Console</text> |
| 33 | <text x="174" y="230" font-weight="600" fill="#94A3B8">React SPA</text> |
| 34 | <line x1="126" y1="244" x2="322" y2="244" stroke="#F1F5F9" stroke-width="1"/> |
| 35 | <text x="126" y="258" fill="#475569">HTTPS & WebSocket interfaces</text> |
| 36 | </g> |
| 37 | <!-- Card 1.2 --> |
| 38 | <g id="app-mobile-card"> |
| 39 | <rect x="346" y="184" width="220" height="82" rx="8" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 40 | <rect x="358" y="198" width="36" height="36" rx="8" fill="#EFF6FF"/> |
| 41 | <text x="376" y="222" text-anchor="middle" font-size="16" font-weight="800" fill="#3B82F6">M</text> |
| 42 | <text x="406" y="214" font-size="15" font-weight="700" fill="#0F172A">Mobile App</text> |
| 43 | <text x="406" y="230" font-weight="600" fill="#94A3B8">iOS / Android</text> |
| 44 | <line x1="358" y1="244" x2="554" y2="244" stroke="#F1F5F9" stroke-width="1"/> |
| 45 | <text x="358" y="258" fill="#475569">Native HTTP/2 client access</text> |
| 46 | </g> |
| 47 | <!-- Card 1.3 --> |
| 48 | <g id="app-open-api-card"> |
| 49 | <rect x="578" y="184" width="220" height="82" rx="8" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 50 | <rect x="590" y="198" width="36" height="36" rx="8" fill="#EFF6FF"/> |
| 51 | <text x="608" y="222" text-anchor="middle" font-size="16" font-weight="800" fill="#3B82F6">O</text> |
| 52 | <text x="638" y="214" font-size="15" font-weight="700" fill="#0F172A">Open API</text> |
| 53 | <text x="638" y="230" font-weight="600" fill="#94A3B8">API Gateway</text> |
| 54 | <line x1="590" y1="244" x2="786" y2="244" stroke="#F1F5F9" stroke-width="1"/> |
| 55 | <text x="590" y="258" fill="#475569">REST & GraphQL for partners</text> |
| 56 | </g> |
| 57 | <!-- Card 1.4 --> |
| 58 | <g id="app-cli-tools-card"> |
| 59 | <rect x="810" y="184" width="220" height="82" rx="8" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 60 | <rect x="822" y="198" width="36" height="36" rx="8" fill="#EFF6FF"/> |
| 61 | <text x="840" y="222" text-anchor="middle" font-size="16" font-weight="800" fill="#3B82F6">C</text> |
| 62 | <text x="870" y="214" font-size="15" font-weight="700" fill="#0F172A">CLI Tools</text> |
| 63 | <text x="870" y="230" font-weight="600" fill="#94A3B8">DevOps</text> |
| 64 | <line x1="822" y1="244" x2="1018" y2="244" stroke="#F1F5F9" stroke-width="1"/> |
| 65 | <text x="822" y="258" fill="#475569">Command-line automation & CI</text> |
| 66 | </g> |
| 67 | </g> |
| 68 | <!-- ==================== Layer 2: Service Layer ==================== --> |
| 69 | <g id="service-layer" data-pptx-bounds="40 296 1006 140"> |
| 70 | <rect x="40" y="296" width="40" height="140" rx="8" fill="#6366F1"/> |
| 71 | <text x="60" y="374" text-anchor="middle" font-size="22" font-weight="800" fill="#FFFFFF">02</text> |
| 72 | <rect x="96" y="296" width="950" height="140" rx="12" fill="#EEF2FF" fill-opacity="0.6" stroke="#A5B4FC" stroke-width="1.5" stroke-dasharray="6 4"/> |
| 73 | <text x="571" y="322" text-anchor="middle" font-size="13" font-weight="700" fill="#4F46E5" letter-spacing="1">SERVICE LAYER · CORE BUSINESS LOGIC & ORCHESTRATION</text> |
| 74 | <!-- Card 2.1 --> |
| 75 | <g id="service-core-routing-card"> |
| 76 | <rect x="114" y="340" width="220" height="82" rx="8" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 77 | <rect x="126" y="354" width="36" height="36" rx="8" fill="#EEF2FF"/> |
| 78 | <text x="144" y="378" text-anchor="middle" font-size="16" font-weight="800" fill="#6366F1">G</text> |
| 79 | <text x="174" y="370" font-size="15" font-weight="700" fill="#0F172A">Core Routing</text> |
| 80 | <text x="174" y="386" font-weight="600" fill="#94A3B8">API Gateway</text> |
| 81 | <line x1="126" y1="400" x2="322" y2="400" stroke="#F1F5F9" stroke-width="1"/> |
| 82 | <text x="126" y="414" fill="#475569">Traffic control & rate limiting</text> |
| 83 | </g> |
| 84 | <!-- Card 2.2 --> |
| 85 | <g id="service-microservices-card"> |
| 86 | <rect x="346" y="340" width="220" height="82" rx="8" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 87 | <rect x="358" y="354" width="36" height="36" rx="8" fill="#EEF2FF"/> |
| 88 | <text x="376" y="378" text-anchor="middle" font-size="16" font-weight="800" fill="#6366F1">M</text> |
| 89 | <text x="406" y="370" font-size="15" font-weight="700" fill="#0F172A">Microservices</text> |
| 90 | <text x="406" y="386" font-weight="600" fill="#94A3B8">Domain Logic</text> |
| 91 | <line x1="358" y1="400" x2="554" y2="400" stroke="#F1F5F9" stroke-width="1"/> |
| 92 | <text x="358" y="414" fill="#475569">Independent business services</text> |
| 93 | </g> |
| 94 | <!-- Card 2.3 --> |
| 95 | <g id="service-iam-card"> |
| 96 | <rect x="578" y="340" width="220" height="82" rx="8" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 97 | <rect x="590" y="354" width="36" height="36" rx="8" fill="#EEF2FF"/> |
| 98 | <text x="608" y="378" text-anchor="middle" font-size="16" font-weight="800" fill="#6366F1">I</text> |
| 99 | <text x="638" y="370" font-size="15" font-weight="700" fill="#0F172A">IAM Service</text> |
| 100 | <text x="638" y="386" font-weight="600" fill="#94A3B8">Auth & Security</text> |
| 101 | <line x1="590" y1="400" x2="786" y2="400" stroke="#F1F5F9" stroke-width="1"/> |
| 102 | <text x="590" y="414" fill="#475569">Centralized SSO and RBAC</text> |
| 103 | </g> |
| 104 | <!-- Card 2.4 --> |
| 105 | <g id="service-event-bus-card"> |
| 106 | <rect x="810" y="340" width="220" height="82" rx="8" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 107 | <rect x="822" y="354" width="36" height="36" rx="8" fill="#EEF2FF"/> |
| 108 | <text x="840" y="378" text-anchor="middle" font-size="16" font-weight="800" fill="#6366F1">E</text> |
| 109 | <text x="870" y="370" font-size="15" font-weight="700" fill="#0F172A">Event Bus</text> |
| 110 | <text x="870" y="386" font-weight="600" fill="#94A3B8">Message Queue</text> |
| 111 | <line x1="822" y1="400" x2="1018" y2="400" stroke="#F1F5F9" stroke-width="1"/> |
| 112 | <text x="822" y="414" fill="#475569">Kafka-based async decoupling</text> |
| 113 | </g> |
| 114 | </g> |
| 115 | <!-- ==================== Layer 3: Data Layer ==================== --> |
| 116 | <g id="data-layer" data-pptx-bounds="40 452 1006 140"> |
| 117 | <rect x="40" y="452" width="40" height="140" rx="8" fill="#8B5CF6"/> |
| 118 | <text x="60" y="530" text-anchor="middle" font-size="22" font-weight="800" fill="#FFFFFF">03</text> |
| 119 | <rect x="96" y="452" width="950" height="140" rx="12" fill="#F5F3FF" fill-opacity="0.6" stroke="#C4B5FD" stroke-width="1.5" stroke-dasharray="6 4"/> |
| 120 | <text x="571" y="478" text-anchor="middle" font-size="13" font-weight="700" fill="#7C3AED" letter-spacing="1">DATA LAYER · PERSISTENT STORAGE & CAPABILITIES</text> |
| 121 | <!-- Card 3.1 --> |
| 122 | <g id="data-relational-db-card"> |
| 123 | <rect x="114" y="496" width="300" height="82" rx="8" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 124 | <rect x="126" y="510" width="36" height="36" rx="8" fill="#F5F3FF"/> |
| 125 | <text x="144" y="534" text-anchor="middle" font-size="16" font-weight="800" fill="#8B5CF6">R</text> |
| 126 | <text x="174" y="526" font-size="15" font-weight="700" fill="#0F172A">Relational DB</text> |
| 127 | <text x="174" y="542" font-weight="600" fill="#94A3B8">PostgreSQL</text> |
| 128 | <line x1="126" y1="556" x2="398" y2="556" stroke="#F1F5F9" stroke-width="1"/> |
| 129 | <text x="126" y="570" fill="#475569">ACID compliant core data storage</text> |
| 130 | </g> |
| 131 | <!-- Card 3.2 --> |
| 132 | <g id="data-cache-layer-card"> |
| 133 | <rect x="430" y="496" width="300" height="82" rx="8" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 134 | <rect x="442" y="510" width="36" height="36" rx="8" fill="#F5F3FF"/> |
| 135 | <text x="460" y="534" text-anchor="middle" font-size="16" font-weight="800" fill="#8B5CF6">C</text> |
| 136 | <text x="490" y="526" font-size="15" font-weight="700" fill="#0F172A">Cache Layer</text> |
| 137 | <text x="490" y="542" font-weight="600" fill="#94A3B8">Redis Cluster</text> |
| 138 | <line x1="442" y1="556" x2="714" y2="556" stroke="#F1F5F9" stroke-width="1"/> |
| 139 | <text x="442" y="570" fill="#475569">Sub-millisecond hot data access</text> |
| 140 | </g> |
| 141 | <!-- Card 3.3 --> |
| 142 | <g id="data-object-storage-card"> |
| 143 | <rect x="746" y="496" width="284" height="82" rx="8" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 144 | <rect x="758" y="510" width="36" height="36" rx="8" fill="#F5F3FF"/> |
| 145 | <text x="776" y="534" text-anchor="middle" font-size="16" font-weight="800" fill="#8B5CF6">O</text> |
| 146 | <text x="806" y="526" font-size="15" font-weight="700" fill="#0F172A">Object Storage</text> |
| 147 | <text x="806" y="542" font-weight="600" fill="#94A3B8">S3 Compatible</text> |
| 148 | <line x1="758" y1="556" x2="1014" y2="556" stroke="#F1F5F9" stroke-width="1"/> |
| 149 | <text x="758" y="570" fill="#475569">Scalable unstructured data</text> |
| 150 | </g> |
| 151 | </g> |
| 152 | <!-- ==================== Right Column: Capabilities ==================== --> |
| 153 | <g id="capability-output" data-pptx-bounds="1066 140 174 452"> |
| 154 | <rect x="1200" y="140" width="40" height="452" rx="8" fill="#10B981"/> |
| 155 | <text x="1220" y="374" text-anchor="middle" font-size="22" font-weight="800" fill="#FFFFFF">04</text> |
| 156 | <rect x="1066" y="140" width="124" height="452" rx="12" fill="#ECFDF5" fill-opacity="0.6" stroke="#6EE7B7" stroke-width="1.5" stroke-dasharray="6 4"/> |
| 157 | <text x="1128" y="166" text-anchor="middle" font-size="13" font-weight="700" fill="#059669" letter-spacing="1">OUTPUT</text> |
| 158 | <g id="output-unified-portal"> |
| 159 | <rect x="1082" y="186" width="92" height="38" rx="6" fill="#FFFFFF" stroke="#A7F3D0" stroke-width="1"/> |
| 160 | <text x="1128" y="210" text-anchor="middle" font-weight="700" fill="#065F46">Unified Portal</text> |
| 161 | </g> |
| 162 | <g id="output-open-sdk"> |
| 163 | <rect x="1082" y="252" width="92" height="38" rx="6" fill="#FFFFFF" stroke="#A7F3D0" stroke-width="1"/> |
| 164 | <text x="1128" y="276" text-anchor="middle" font-weight="700" fill="#065F46">Open SDK</text> |
| 165 | </g> |
| 166 | <g id="output-ops-console"> |
| 167 | <rect x="1082" y="318" width="92" height="38" rx="6" fill="#FFFFFF" stroke="#A7F3D0" stroke-width="1"/> |
| 168 | <text x="1128" y="342" text-anchor="middle" font-weight="700" fill="#065F46">Ops Console</text> |
| 169 | </g> |
| 170 | <g id="output-data-market"> |
| 171 | <rect x="1082" y="384" width="92" height="38" rx="6" fill="#FFFFFF" stroke="#A7F3D0" stroke-width="1"/> |
| 172 | <text x="1128" y="408" text-anchor="middle" font-weight="700" fill="#065F46">Data Market</text> |
| 173 | </g> |
| 174 | <g id="output-webhooks"> |
| 175 | <rect x="1082" y="450" width="92" height="38" rx="6" fill="#FFFFFF" stroke="#A7F3D0" stroke-width="1"/> |
| 176 | <text x="1128" y="474" text-anchor="middle" font-weight="700" fill="#065F46">Webhooks</text> |
| 177 | </g> |
| 178 | <g id="output-partner-api"> |
| 179 | <rect x="1082" y="516" width="92" height="38" rx="6" fill="#FFFFFF" stroke="#A7F3D0" stroke-width="1"/> |
| 180 | <text x="1128" y="540" text-anchor="middle" font-weight="700" fill="#065F46">Partner API</text> |
| 181 | </g> |
| 182 | </g> |
| 183 | <!-- ==================== Bottom: Foundation ==================== --> |
| 184 | <g id="foundation" data-pptx-bounds="40 608 1200 80"> |
| 185 | <rect x="40" y="608" width="40" height="80" rx="8" fill="#64748B"/> |
| 186 | <text x="60" y="654" text-anchor="middle" font-size="22" font-weight="800" fill="#FFFFFF">05</text> |
| 187 | <rect x="96" y="608" width="1144" height="80" rx="12" fill="#F8FAFC" stroke="#CBD5E1" stroke-width="1.5" stroke-dasharray="6 4"/> |
| 188 | <text x="668" y="630" text-anchor="middle" font-weight="700" fill="#475569" letter-spacing="1">FOUNDATION · CROSS-CUTTING SHARED CAPABILITIES</text> |
| 189 | <!-- Foundation Modules --> |
| 190 | <rect x="116" y="640" width="144" height="34" rx="6" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 191 | <text x="188" y="662" text-anchor="middle" font-weight="600" fill="#334155">Log Aggregation</text> |
| 192 | <rect x="272" y="640" width="144" height="34" rx="6" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 193 | <text x="344" y="662" text-anchor="middle" font-weight="600" fill="#334155">Metrics & Alarms</text> |
| 194 | <rect x="428" y="640" width="144" height="34" rx="6" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 195 | <text x="500" y="662" text-anchor="middle" font-weight="600" fill="#334155">Distributed Tracing</text> |
| 196 | <rect x="584" y="640" width="144" height="34" rx="6" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 197 | <text x="656" y="662" text-anchor="middle" font-weight="600" fill="#334155">Config Center</text> |
| 198 | <rect x="740" y="640" width="144" height="34" rx="6" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 199 | <text x="812" y="662" text-anchor="middle" font-weight="600" fill="#334155">CI / CD Pipeline</text> |
| 200 | <rect x="896" y="640" width="144" height="34" rx="6" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 201 | <text x="968" y="662" text-anchor="middle" font-weight="600" fill="#334155">Security & Audit</text> |
| 202 | <rect x="1052" y="640" width="144" height="34" rx="6" fill="#FFFFFF" stroke="#E2E8F0" stroke-width="1"/> |
| 203 | <text x="1124" y="662" text-anchor="middle" font-weight="600" fill="#334155">Resource Mgt</text> |
| 204 | </g> |
| 205 | </svg> |
| 206 |