专业的手机游戏 手机软件下载基地

安卓软件|苹果软件|下载排行|最近更新

当前位置:首页软件教程电脑教程 → vscode如何绘制流程图?visual studio code绘制流程图的方法

vscode如何绘制流程图?visual studio code绘制流程图的方法

时间:2021-11-29 15:19:04人气:作者:下载猫我要评论

VSCode是一款好用的免费源代码编辑器,那么如何使用vscode绘制流程图呢?下面小编给大家整理了相关步骤介绍,感兴趣的小伙伴不要错过哦!

vscode如何绘制流程图?visual studio code绘制流程图的方法

首先要打开电脑中的visual studio code,点击左侧四个方块按钮

vscode如何绘制流程图?visual studio code绘制流程图的方法

然后在搜索框中输入draw.io查询插件,点击安装

vscode如何绘制流程图?visual studio code绘制流程图的方法截图

安装好后,新建一个test.drawio文件

vscode如何绘制流程图?visual studio code绘制流程图的方法截图

接着选中test.drawio文件,进入编辑模式

vscode如何绘制流程图?visual studio code绘制流程图的方法截图

左侧有各种图形,随意选择,就可以绘制流程图了

vscode如何绘制流程图?visual studio code绘制流程图的方法截图

绘制好后,点击文件→嵌入→svg

vscode如何绘制流程图?visual studio code绘制流程图的方法截图

下面再选择嵌入

vscode如何绘制流程图?visual studio code绘制流程图的方法截图

复制svg代码

vscode如何绘制流程图?visual studio code绘制流程图的方法截图

将复制的svg代码粘贴到html代码中

vscode如何绘制流程图?visual studio code绘制流程图的方法截图

打开html网页,就可以看到绘制的流程图了

vscode如何绘制流程图?visual studio code绘制流程图的方法截图

点击网页上的图片,就可以跳转页面

在该页面可以放大缩小流程图

在这里,我们选择点击右下角的铅笔图案,跳转网页编辑页面

vscode如何绘制流程图?visual studio code绘制流程图的方法截图

在网页编辑页面,又可以对流程图重新做编辑

vscode如何绘制流程图?visual studio code绘制流程图的方法截图

这里可以选择File→Save,最后选择png格式图片保存

vscode如何绘制流程图?visual studio code绘制流程图的方法截图
vscode如何绘制流程图?visual studio code绘制流程图的方法截图

以上这篇文章就是visual studio code绘制流程图的方法,更多精彩教程请关注下载猫!

相关软件教程

猜你喜欢

网友评论

关于下载猫 | 联系方式 | 发展历程 | 版权声明 | 下载帮助 | 广告联系 | 网站地图

Copyright 2017-2021 WWW.XIAZAICAT.COM 【下载猫】 版权所有 桂ICP备2022011625号

声明: 本站所有软件和文章来自互联网 如有异议 请与本站联系 本站为非赢利性网站 不接受任何赞助和广告