如何利用 GPT4创建引人注目的流程图

如何利用 GPT4创建引人注目的流程图

流程图是可视化复杂思想和过程的首选工具。然而,创建一个好的流程图可能需要很多时间。

在本文中,我将向你展示如何在不到一分钟的时间内使用ChatGPT(最好是GPT-4)创建令人惊叹的流程图。

生成Mermaid语法图表

我使用名为 mermaid.live 的流程图编辑器进行流程图的编辑工作。虽然这个编辑器有一套自己的语法示例,但你不需要对它有深入的了解或熟悉,因为所有的编辑工作都会由ChatGPT来完成。

只需复制GPT生成的Mermaid代码,然后将其粘贴到mermaid.live中,你将立即获得一个精美的图表。那我们现在就开始创建第一个流程图吧:

使用 mermaid.js flowchart 语法,生成一个图表,显示12306订票流程图

生成了以下代码:

graph TD
A(选择出发地和目的地) --> B(选择日期和车次)
B --> C(选择座位类型)
C --> D(登录账号)
D --> E(填写乘客信息)
E --> F(核对订单信息)
F --> G(选择支付方式)
G --> H(完成支付)
H --> I(获取订单确认)
I --> J(出票成功)
J --> K(结束)
F --> L(订单信息有误)
L --> M(修改订单信息)
M --> F
G --> N(支付失败)
N --> G
D --> O(账号登录失败)
O --> P(重新登录)
P --> D

在下面的示例中,ChatGPT使用了与我提示的不同的图表类型

生成用户旅程图试试?

使用 mermaid.js user journey daigram 语法,生成一个图表,显示登陆系统的用户旅程

生成的代码:

journeytitle 用户登录系统section 访问登录页面登录页面-->|用户打开登录页面| 输入用户名和密码 : 用户在登录页面输入用户名和密码section 提交登录表单输入用户名和密码-->|用户点击登录按钮| 提交登录表单 : 用户提交登录表单进行验证section 验证登录信息提交登录表单-->|系统验证用户名和密码| 验证登录信息 : 系统验证用户提交的用户名和密码section 登录成功验证登录信息-->|验证成功| 登录成功 : 用户成功登录系统section 登录失败验证登录信息-->|验证失败| 显示登录失败消息 : 用户登录失败,系统显示登录失败的消息

生成甘特图试试?

使用 mermaid.js v. 9.2.2 Gantt chart daigram 语法,生成一个图表,显示软件开发任务进度安排

生成的代码:

    dateFormat  YYYY-MM-DDtitle 软件开发任务进度安排section 项目计划需求分析      :a1, 2023-07-01, 7d设计          :a2, after a1, 5d开发          :a3, after a2, 14d测试          :a4, after a3, 7dsection 项目部署部署          :b1, 2023-08-01, 3d上线运行      :b2, after b1, 2dsection 支持和维护用户支持      :c1, after b2, 7d故障排除      :c2, after c1, 7d

GPT可以协助生成各种类型的图表,比如思维导图(Mindmap),时间线(Timeline),和类图(Class Diagram)等,需要根据实际需求来确定。可能初始生成的图表并不完全满足需求,但可以通过持续提供更多信息来不断优化,直到得到满意的结果。

代码生成流程图

对于程序猿来说,更好用的是用GPT来帮你读代码并画流程图,我尝试让GPT为我项目中的阿里支付部分代码生活流程图:

使用 mermaid.js flowchart 语法 [这里插入代码]

生成的代码:

graph LR
A[开始] --> B[发送请求]
B --> C[解析响应]
C --> D{响应码是否为200?}
D -->|是| E[判断是否为移动设备]
D -->|否| G[显示错误信息]
E --> F[设置二维码]
C --> H[设置URL]
C --> I[设置倒计时]
I --> J[创建定时器]
J --> K[更新倒计时]
K -->|倒计时<=0| L[清除定时器]
K -->|倒计时>0| J
L --> M[隐藏充值界面]
L --> N[清除URL]
J --> O[检查是否到账]
O -->|倒计时<=0| P[清除定时器]
O -->|倒计时>0| Q[发送检查请求]
Q --> R[解析检查响应]
R --> S{响应码是否为200?}
S -->|是| T[判断是否充值已到账]
S -->|否| O
T --> U[更新用户信息]
U --> V[显示充值成功信息]
V --> M
V --> N
G --> A
P --> A

你甚至可以利用它生成Asciiflow的流程图来便利地写入代码注释之中。

  +--------+        +------------+        +----------+| 开始   | -----> | 发送请求  | -----> | 解析响应 |+--------+        +------------+        +----------+||响应码是否为200?||+---------v---------+|       是          || 判断是否为移动设备 ||       否          |+---------+---------+||+---------v---------+|       是          ||   设置二维码      |+---------+---------+||+---------v---------+|     显示错误信息   |+---------+---------+||+---------v---------+|     设置URL       |+---------+---------+||+---------v---------+|    设置倒计时     |+---------+---------+||+---------v---------+|   创建定时器       |+---------+---------+||+---------v---------+|   更新倒计时       |+---------+---------+||倒计时 <= 0? |  倒计时 > 0?||+---------v---------+|    清除定时器      |+---------+---------+||+---------v---------+|  检查是否到账    |+---------+---------+||倒计时 <= 0? |  倒计时 > 0?||+---------v---------+|  清除定时器       |+---------+---------+||+---------v---------+|   发送检查请求    |+---------+---------+||+---------v---------+|   解析检查响应    |+---------+---------+||响应码是否为200?||+---------v---------+|       是          ||   充值已到账      |+---------+---------+||+---------v---------+|    隐藏充值界面    |+---------+---------+

这样,你可以轻松地为你的复杂代码创造出详细的流程图。你只需要生成文本形式的流程,然后将其粘贴在代码注释之中。这将帮助你的同事更好地理解你的代码。

结论

很令人兴奋能够看到ChatGPT如何将简单的提示和长篇文章转化为令人惊叹的流程图。手动创建这样的可视化通常需要花费大量的时间。尝试将类似的内容纳入您的工作流程中,发挥您的想象力!

附 ChatGPT4镜像站

本文由mdnice多平台发布

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/22308.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

CSS3---选择器分类,最全版

目录 标签选择器(元素选择器) 类选择器 id选择器 通配符选择器 伪类选择器 链接伪类选择器 结构伪类选择器 目标伪类选择器 标签选择器(元素选择器) 标签选择器&#xff0c;是指用HTML标签名称作为选择器&#xff0c;按照标签名称分类&#xff0c;为某一类标签指定统一的…

ChatGPT已过时?Auto-GPT迅速走红,无需人类插手自主解决复杂任务,GitHub标星5万

来源: AI前线 微信号&#xff1a;ai-front 作者 | Luke Larsen ChatGPT 之所以能风靡全球&#xff0c;很大程度上要归功于其简单的功能框架。作为一款 AI 聊天机器人&#xff0c;它唯一的作用就是生成令人信服的自然语言文本、顺畅回应用户的提问。 但 AI 聊天机器人的使用体…

ChatGPT已过时?Auto-GPT迅速走红,无需人类插手自主解决复杂任务,GitHub标星5万...

来源&#xff1a;AI前线 作者&#xff1a;Luke Larsen 译者&#xff1a;核子可乐 策划&#xff1a;冬梅 ChatGPT 之所以能风靡全球&#xff0c;很大程度上要归功于其简单的功能框架。作为一款 AI 聊天机器人&#xff0c;它唯一的作用就是生成令人信服的自然语言文本、顺畅回应用…

telegram纯协议电报群发,自动加群,引流自动化解放双手*

全自动协议批量发送&#xff0c;一键简便操作&#xff0c;极大节省时间和精力。遇到问题时&#xff0c;日志自动诊断&#xff0c;整个过程无需人工干预。目前市场上功能最全面的国内外营销软件&#xff0c;吸引流量效果卓越&#xff01;

智能黑白图像自动上色——C++实现

前言 《Colorful Image Colorization》是加里福利亚大学Richard Zhang发表在ECCV 2016上的文章&#xff0c;论文主要解决的问题是给灰度图的自动着色&#xff0c;算法并不是为恢复灰度图的真实颜色&#xff0c;而是用灰度图中物体的纹理、语义等信息作为线索&#xff0c;来预测…

解密银行客户经理展业利器系列一:商机共享、创收增长

2023年银行业面临存款、贷款、利润三大变局&#xff0c;与此同时&#xff0c;商业银行的数字化转型正延展至前台建设&#xff0c;期望通过科技手段布局应对&#xff0c;数字化重装身处一线的客户经理&#xff0c;带动单位时间创收提升&#xff0c;更有力地支撑银行业务战略发展…

chatgpt赋能python:Python安装paramiko,实现SSH远程连接

Python安装paramiko&#xff0c;实现SSH远程连接 作为一种开源的Python库&#xff0c;Paramiko提供了SSH 协议的实现方式&#xff0c;使得Python程序能够方便地与SSH服务器通信&#xff0c;完成以SSH协议为基础的操作&#xff0c;比如服务器批量管理、远程执行命令和文件传输等…

GPT4 api 申请

从官网申请 GPT4 api 的申请权限&#xff0c;似乎在这之前您必须是一个ChatGPT的plus会员 填写表格 注意&#xff0c;组织ID&#xff0c;从图所示的小字部分点击链接&#xff0c;获取组织ID&#xff0c;也可以点击这How do you primarily plan to use GPT-4? * 这个选项可以…

Unity3d 使用Chart And Graph插件进行数据可视化(柱状图、折线图、饼图等)基本使用

前言 首先来夸夸这个插件&#xff0c;美观性、响应速度和互动性。易于上手和快速设置。每项功能都可以从代码和编辑器中自定义。“图形和图表”兼容性强&#xff0c;包括 VR/AR、移动端、网页和桌面端等。与 UGUI Canvas 完美集成。一句话数据可视化选它完美。 使用 插件导入…

R:热图解释 | pheatmap包参数及详细聚类图绘制流程(一篇解决热图绘制问题)

热图解释及pheatmap绘制热图 一、热图绘制原理1.1 热图介绍1.2 热图绘制准备——均一化1.3 热图绘制方式1.4 热图数据查看示例 二、pheatmap包简介2.1 pheatmap介绍2.2 pheatmap详细参数解释2.3 pheatmap安装及加载 三、pheatmap包绘制热图示例3.1 数据准备3.2 数据导入及绘图3…

R | 可视化 | 热图(Heatmap)

1 基础绘制 R绘制热图时&#xff0c;数据需要输入一个矩阵&#xff0c;可以用as.matrix()把它转换成矩阵。这里利用R自带的数据集绘制热图。 > # 数据 > data <- as.matrix(mtcars) > > # 绘制热图 > heatmap(data) OUTPUT: 热图的每一列是一个变量&…

TeeChart绘制Gant图

软件安装 及使用 VS2010 使用TeeChart绘图控件 - 之一 - 控件和类的导入_尘中远的博客-CSDN博客_teechartVS2010 使用TeeChart绘图控件 - 之一 - 控件和类的导入VS2010 使用TeeChart绘图控件 - 之二 - 绘制图形&#xff08;折线图&#xff0c;柱状图&#xff09;TeeChart绘图控…

使用GraphInsight打造TuGraph可视化分析应用

图的可视化是分析和理解图数据的一种重要手段。TuGraph 内置了TuGraph Browser&#xff0c;为大多数用户提供了一个简单易用的图可视化界面。由于 TuGraph Browser 不支持自定义界面&#xff0c;因此一些有自定义界面需求的用户只能选择自行搭建新的前端界面。11月22日&#xf…

热图 -- pheatmap or ggplot2

文章目录 brief数据准备 pheatmap实例最朴素的方式数据缩放取消聚类更改每个小方格的大小聚类以及聚类方式和参数修改热图呈现的颜色修改legend ggplot2实例ggplot2实例变式添加 group bar做成dotplot pheatmap 多图组合问题 brief 这里主要记录了pheatmap 以及 ggplot2实现热…

GTK渲染摄像头图像数据

GTK渲染摄像头图像数据 1.GDK简介 绘图工具集(GDK&#xff0c;Graphics Drawing Kit)是在GTK 和特定操作系统的应用编程接口(API,Application Program Interface)之间的低级绘图制层—— Linux的API是Xlib。由于GTK和机器的API之间没有直接接口&#xff0c;移植GTK就成为移植G…

Pheatmap热图的绘制及如何调整图片

Pheatmap热图的绘制及如何调整图片 Pheatmap包是R语言绘制热图比较强大的软件包&#xff0c;当然现在也有很多资料介绍这个包的使用&#xff0c;但是今天我写的重点不是如何使用这个包绘制热图&#xff0c;而是如何绘制出更好看的热图。&#xff08;我使用的矩阵是1663x594&am…

unity可视化图表插件XCharts绘制折线图、饼图、柱状图

一、简介 一款基于UGUI的功能强大、易用、参数可配置的数据可视化图表插件。支持折线图、柱状图、饼图、雷达图、散点图、热力图等常见图表。 特性&#xff1a; 内置丰富示例和模板&#xff0c;参数可视化配置&#xff0c;效果实时预览&#xff0c;纯代码绘制。 支持折线图、柱…

日语学习软件推荐——五十音图APP:AI纠正你的日语发音

每个自学日语的人&#xff0c;想必都经历过“哑巴日语”的苦恼。收集了很多学习资料&#xff0c;努力积累词汇量&#xff0c;一开口却暴露了“散装口语”的短板。 但是现在就不怕这个问题啦&#xff0c;五十音图APP可以让你从入门开始&#xff0c;练就一口流利的地道日语&…

白痴学日语系列之初识日语(二)

每日记单词 間[あいだ]0 a i da 间&#xff0c;间隔 【记】あい&#xff08;合い→互相之间&#xff09;だ&#xff08;是&#xff09;→间隔 青[あお]1 a o 蓝色&#xff1b;青色&#xff1b;绿色&#xff1b;不成熟 【记】あ&#xff08;上&#xff09;お&#xff08;う→…

新标日语学习笔记

文章目录 新标日语学习笔记第一章 日语入门1.1 五十音1.2 日语声调1.2.1 声调理解1.2.2 高低音发音1.2.3 简单的高低音发音练习 1.3 浊音和长音1.3.1 浊音1.3.2 长音 1.4 促音和拗音 第二章 课文与笔记2.1 小李是中国人2.1.1 单词2.1.2 语法 新标日语学习笔记 第一章 日语入门…