vscode使用Draw.io Integration绘制流程图

一. 内容简介

vscode使用Draw.io Integration绘制流程图

二. 软件环境

2.1 vscode

2.2 Draw.io Integration

文中文件
链接:https://pan.baidu.com/s/1VJbrScgIexsNYHNr48f4Bw?pwd=1234

三.主要流程

3.1 安装Draw.io Integration

3.2 基本使用

四.具体步骤

3.1 安装Draw.io Integration

在拓展商店里面搜索,下载第一个即可
vscode使用Draw.io Integration绘制流程图_第1张图片

3.2 基本使用

可以点进插件里面看一下,有demo教怎么创建
vscode使用Draw.io Integration绘制流程图_第2张图片
当打开特定文件格式时候,会自动执行,这里可以创建一个文件,huibao.drawio,后缀需要是.drawio

vscode使用Draw.io Integration绘制流程图_第3张图片
左边三个选项可以选择模块,现在开始添加

vscode使用Draw.io Integration绘制流程图_第4张图片
添加完事后,进行样式调整,选中什么,屏幕右侧就会出现可以调整样式的选项
vscode使用Draw.io Integration绘制流程图_第5张图片
可以把整个背板换成白色,然后字体颜色,字体背景色,还有箭头颜色,还有框的填充颜色,找找就行了
vscode使用Draw.io Integration绘制流程图_第6张图片
最后一点就是导出,导出的图片多少看着都有点模糊,在文件里面选属性,缩放调大点就好了,
vscode使用Draw.io Integration绘制流程图_第7张图片


如果流程图有图片出现,就会出现这种黑框,解决办法就是,把图片用截图截一下放进来就好了

你可能感兴趣的:(draw.io,流程图)