当前位置：首页 > news >正文

使用mermaid 语言绘画时序图和链路图

news 来源：原创 2025/5/15 8:08:15

给大家展示一下效果，
官方地址：https://mermaid.nodejs.cn/
官方开发地：https://mermaid.nodejs.cn/intro/#google_vignette
在这里插入图片描述

graph LR%% ==================== 样式定义（完全保留） ====================classDef user fill:#E1F5FE,stroke:#0288D1;classDef app fill:#E8F5E9,stroke:#388E3C;classDef data fill:#F3E5F5,stroke:#8E24AA;classDef infra fill:#FFF3E0,stroke:#FB8C00;classDef biz fill:#FFEBEE,stroke:#E53935,dashed;classDef screen fill:#FCE4EC,stroke:#EC407A;classDef middleware fill:#DCE775,stroke:#AFB42B;classDef notification fill:#FF8A65,stroke:#E64A19;classDef external fill:#B39DDB,stroke:#5E35B1;%% ==================== 外部系统节点（完全保留） ====================xx数据库:::externalyy数据库:::external钉钉告警:::notification%% ==================== 数据采集源（完全保留） ====================subgraph 数据采集["多源数据采集"]MQ消费数据:::middlewareAPI接口服务:::app库间迁移工具:::middlewareend%% ==================== 用户层（完全保留） ====================subgraph 用户层["用户终端"]生产设备:::user微信小程序:::user监管工作台:::user消费者APP:::user企业录入终端:::userend%% ==================== 应用层（完全保留） ====================subgraph 应用层["应用服务"]SpringBoot核心服务:::app溯源码管理:::app数据治理服务:::app任务调度服务:::append%% ==================== 数据层修改点 ====================subgraph 数据层["数据服务"]subgraph 达梦集群["达梦集群"]达梦节点1:::data达梦节点2:::data达梦节点3:::dataend前置达梦数据库:::dataRedis缓存:::dataMinIO文件存储:::dataend%% ==================== 紫光云中间件（完全保留） ====================subgraph 中间件["紫光云中间件"]RocketMQ消息队列:::middlewareNginx负载均衡:::middlewareDolphinScheduler:::middlewareElasticsearch:::middlewareend%% ==================== 华为云基础设施（完全保留） ====================subgraph 基础设施["华为平台"]容器引擎:::infraDockerSwarm:::infraPrometheus监控:::infraGrafana看板:::infraend%% ==================== 可视化大屏（完全保留） ====================subgraph 可视化大屏["业务大屏"]总大屏ECharts:::screen经营大屏TS:::screen生产大屏3D:::screen监管大屏GIS:::screenend%% ==================== 核心业务流（完全保留） ====================企业录入终端 -->|原料数据| SpringBoot核心服务SpringBoot核心服务 -->|数据存储| 达梦节点1微信小程序 -->|扫码查询| 溯源码管理溯源码管理 -->|数据查询| SpringBoot核心服务监管工作台 -->|监管指令| 监管大屏GIS生产设备 -->|IoT数据| RocketMQ消息队列%% ==================== 多源数据入库修改点 ====================%% 1. MQ消费入库（保留）MQ消费数据 -->|消费消息| RocketMQ消息队列RocketMQ消息队列 -->|数据处理| 达梦节点1%% 2. API接口入库（保留）API接口服务 -->|接收数据| SpringBoot核心服务SpringBoot核心服务 -->|写入主库| 达梦节点2%% 3. 库间迁移入库（修改连线）莱斯数据库 -->|DataX迁移| 库间迁移工具美亚数据库 -->|Kettle迁移| 库间迁移工具库间迁移工具 -->|数据加载| 前置达梦数据库前置达梦数据库 -->|定时同步| 达梦节点3DolphinScheduler -->|调度DataX| 库间迁移工具DolphinScheduler -->|调度Kettle| 库间迁移工具%% ==================== 中间件服务连接（完全保留） ====================Nginx负载均衡 -->|请求分发| SpringBoot核心服务DolphinScheduler -->|任务调度| 数据治理服务Elasticsearch -->|索引查询| 溯源码管理SpringBoot核心服务 -->|缓存读取| Redis缓存SpringBoot核心服务 -->|消息发布| RocketMQ消息队列%% ==================== 监控告警连接（完全保留） ====================Prometheus监控 -->|指标采集| 容器引擎Grafana看板 -->|告警推送| 钉钉告警容器引擎 -->|容器监控| Prometheus监控%% ==================== 业务标注（完全保留） ====================subgraph 业务流["核心业务流程"]direction TBB1[企业录入]:::bizB2[生产溯源]:::bizB3[消费者扫码]:::bizB4[供应链可视化]:::bizB5[质量管控]:::bizB6[经营决策]:::bizB1 --> B2 --> B3 --> B4 --> B6B3 --> B5 --> B6end%% ==================== 业务技术映射（完全保留） ====================企业录入终端 -.-> B1SpringBoot核心服务 -.-> B2微信小程序 -.-> B3数据治理服务 -.-> B5经营大屏TS -.-> B6%% ==================== 国产化标注（完全保留） ====================style 基础设施 stroke:#E53935,stroke-width:2pxstyle 中间件 stroke:#E53935,stroke-width:2pxstyle 达梦集群 stroke:#E53935style 前置达梦数据库 stroke:#E53935%% ==================== 新增同步说明 ====================subgraph 同步说明[" "]direction TBS1["DataX每日00:30同步"]S2["Kettle每日01:00同步"]S3["前置库→达梦集群每日02:00同步"]end

sequenceDiagramtitle 食品安全溯源系统时序图%% 全局参与者定义box 用户层participant 消费者 as 消费者(微信小程序)participant 监管员 as 监管员(工作台)participant 企业员工 as 企业员工(Web终端)participant 供应商系统 as 供应商系统(API)endbox 应用服务层participant 溯源服务 as 溯源服务(SpringBoot)participant 数据治理 as 数据治理(海豚调度)participant 大屏服务 as 大屏服务(TS+ECharts)endbox 数据存储层participant 达梦DB as 达梦8(主集群)participant Redis as Redis(哨兵模式)participant MinIO as MinIO(对象存储)end%% ============== 场景1：双通道数据录入 ==============Note over 企业员工,供应商系统: 场景1：混合数据录入通道rect rgb(240,248,255)企业员工->>溯源服务: POST /api/batches溯源服务->>达梦DB: BEGIN TRANSACTION达梦DB-->>溯源服务: 返回事务ID溯源服务->>MinIO: PUT /quality-docsMinIO-->>溯源服务: 返回ETag溯源服务->>Redis: SETEX batch:${id} 604800溯源服务-->>企业员工: HTTP 201 Createdend%% ===== API数据接入 =====rect rgb(245,245,220)供应商系统->>溯源服务: POST /api/materialsactivate 溯源服务溯源服务->>溯源服务: OAuth2验证alt 验证成功溯源服务->>达梦DB: INSERT supplier_data溯源服务->>Redis: DEL supplier:{id}溯源服务-->>供应商系统: 200 OK (ETag)else 验证失败溯源服务-->>供应商系统: 401 Unauthorizedenddeactivate 溯源服务end%% ============== 场景2：消费者溯源查询 ==============Note over 消费者,Redis: 场景2：消费者扫码溯源rect rgb(230,230,250)消费者->>溯源服务: GET /trace/ABC123alt 缓存命中溯源服务->>Redis: HGETALL trace:ABC123Redis-->>溯源服务: 返回完整链路数据else 缓存穿透溯源服务->>达梦DB: EXEC sp_trace_detail达梦DB-->>溯源服务: 结果集溯源服务->>Redis: HSET trace:ABC123end溯源服务-->>消费者: HTTP 200 OKend%% ============== 场景3：监管数据分析 ==============Note over 监管员,大屏服务: 场景3：实时监管看板rect rgb(255,240,245)监管员->>大屏服务: GET /dashboard/region大屏服务->>溯源服务: 调用聚合API溯源服务->>达梦DB: CALL sp_region_stats达梦DB-->>溯源服务: 返回指标数据集溯源服务->>大屏服务: Server-Sent Events推送大屏服务->>大屏服务: 数据标准化处理大屏服务-->>监管员: 渲染热力图GIS展示end%% ============== 场景4：离线数据治理 ==============Note over 数据治理,达梦DB: 场景4：定时数据治理任务loop 每日02:00执行rect rgb(240,255,240)数据治理->>达梦DB: EXEC etl_job_daily数据治理->>供应商系统: GET /api/supplier/updates供应商系统-->>数据治理: 返回增量JSON数据治理->>达梦DB: MERGE INTO supplier_master达梦DB-->>数据治理: 输出合并统计endend%% ============== 场景5：系统健康监控 ==============Note over 溯源服务,Redis: 场景5：系统健康监测rect rgb(255,250,240)溯源服务->>Redis: INCR system:health:service1Redis->>监控系统: 触发阈值告警监控系统-->>运维人员: 钉钉机器人告警运维人员-->>监控系统: 已确认告警end