4.9 KiB
4.9 KiB
- 流程图要素
-
要素名称 定义 图形符号 示例 流程起点 流程开始的位置 圆形或椭圆（通常比较简单的形状来突出开始） 在“客户服务流程”中，“客户发起咨询”是起点 流程终点 流程结束的位置 圆形或椭圆（可以通过颜色、加粗等方式与起点区分） “客户问题解决并反馈满意”是客户服务流程的终点 活动/步骤 流程中执行的任务或操作 矩形 在软件开发流程里，“编写代码”“代码测试”是活动步骤 决策点 根据条件进行判断的点，决定流程分支走向 菱形 在项目审批流程中，“是否通过初审”是决策点 流程线 连接各流程要素，表明流程顺序和方向 带箭头的线条 连接“采购申请”到“部门领导审批”的箭头线条 文档/数据 流程中产生、使用或参考的文件、数据或信息 平行四边形 在论文发表流程中，“投稿论文”（文档）作为一个要素 子流程 包含在主流程中的一个独立小流程，可以单独细化 双矩形（不同软件可能有不同表示） 在企业生产流程中，“设备维护流程”作为一个子流程嵌套在整体生产流程里 注释 对流程要素进行补充说明的内容，使流程更易理解 矩形框（一般带有折线连接到被注释的要素）或文本框 对复杂的“算法设计流程”中的某个决策点进行原理注释
-
-
graph TD A("fab:fa-youtube Starter Guide") --> B("fab:fa-youtube Make Flowchart") B --> C("fa:fa-book-open Learn More") C --> n1[" "] & D{"Use the editor"} & n2["Many shapes"] & n3["Untitled Node"] D -- Build and Design --> E("fa:fa-shapes Visual Editor") E --> F("fa:fa-chevron-up Add node in toolbar") D -- Use AI --> G("fa:fa-comment-dots AI chat") G --> H("fa:fa-arrow-left Open AI in side menu") D -- Mermaid js --> I("fa:fa-code Text") I --> J("fa:fa-arrow-left Type Mermaid syntax") %%{init: {'theme':'forest'}}%% n1@{ icon: "fa:gem", pos: "b", h: 24} n2@{ shape: delay} n3@{ shape: rounded} style E color:#FFFFFF, fill:#AA00FF, stroke:#AA00FF style G color:#FFFFFF, stroke:#00C853, fill:#00C853 style I color:#FFFFFF, stroke:#2962FF, fill:#2962FF -
flowchart TD A(("You have decided to play a game tonight")) --> n8(["Great!!!"]) ny{{"Are you going to play alone?"}} -- Yes --> nq{{"Singleplayer games"}} n8 --> np("Start your computer") np --> ny n7("Are your friends online?") -- Yes --> nw("Do they wanna play?") nq --> nc{{"Time to pick the game"}} n7 -- No --> nq nw -- No --> nq nw -- Yes --> n2("time to pick the game") n2 --> n1("World of Warcraft") & n9("StarCraft") & nj("League of legends") & ns("DOTA 2") & nu("Minecraft") nc --> ni{{"DOOM"}} & nk{{"Baldurs Gate 3"}} & nb{{"Fallout new vegas"}} & n0{{"Witcher"}} & nl{{"Sims"}} nl --> nf[["Now that you have picked a game"]] n0 --> nf nb --> nf nk --> nf ni --> nf n1 --> no[["Now that you have picked a game"]] n9 --> no nj --> no ns --> no nu --> no nf --> nd{"Great have fun!"} no --> nd ny -- No --> n7 np --> n7 style A fill:#C8E6C9,stroke-width:4px,stroke-dasharray: 0,stroke:#00C853 style n8 stroke-width:4px,stroke-dasharray: 0,fill:#C8E6C9,stroke:#00C853 style ny stroke-width:4px,stroke-dasharray: 0,stroke:#FF6D00,fill:#FFE0B2 style nq stroke-width:4px,stroke-dasharray: 0,stroke:#FF6D00,fill:#FFE0B2 style np stroke:#00C853,stroke-width:4px,stroke-dasharray: 0 style n7 stroke-width:4px,stroke-dasharray: 0,fill:#BBDEFB,stroke:#2962FF style nw stroke-width:4px,stroke-dasharray: 0,stroke:#2962FF,fill:#BBDEFB style nc stroke-width:4px,stroke-dasharray: 0,stroke:#FF6D00,fill:#FFE0B2 style n2 stroke-width:4px,stroke-dasharray: 0,fill:#BBDEFB,stroke:#2962FF style n1 stroke-width:4px,stroke-dasharray: 0,fill:#BBDEFB,stroke:#2962FF style n9 stroke-width:4px,stroke-dasharray: 0,fill:#BBDEFB,stroke:#2962FF style nj stroke-width:4px,stroke-dasharray: 0,fill:#BBDEFB,stroke:#2962FF style ns stroke-width:4px,stroke-dasharray: 0,fill:#BBDEFB,stroke:#2962FF style nu stroke-width:4px,stroke-dasharray: 0,fill:#BBDEFB,stroke:#2962FF style ni stroke-width:4px,stroke-dasharray: 0,fill:#FFE0B2,stroke:#FF6D00 style nk stroke-width:4px,stroke-dasharray: 0,stroke:#FF6D00,fill:#FFE0B2 style nb stroke-width:4px,stroke-dasharray: 0,stroke:#FF6D00,fill:#FFE0B2 style n0 stroke-width:4px,stroke-dasharray: 0,stroke:#FF6D00,fill:#FFE0B2 style nl stroke-width:4px,stroke-dasharray: 0,stroke:#FF6D00,fill:#FFE0B2 style nf stroke:#AA00FF,stroke-width:4px,stroke-dasharray: 0,fill:#E1BEE7 style no stroke-width:4px,stroke-dasharray: 0,fill:#E1BEE7,stroke:#AA00FF style nd stroke-width:4px,stroke-dasharray: 0,stroke:#AA00FF,fill:#C8E6C9