vscode如何绘制流程图?visual studio code绘制流程图的方法
设·集合小编 发布时间:2023-02-27 13:40:12 1987次最后更新:2024-07-07 17:37:51
VSCode是一款好用的免费源代码编辑器,那么如何使用vscode绘制流程图呢?下面给大家整理了相关步骤介绍,感兴趣的小伙伴不要错过哦!
vscode如何绘制流程图?visual studio code绘制流程图的方法
首先要打开电脑中的visual studio code,点击左侧四个方块按钮
![](/d/file/p/2023/02/5175856138608138205.png)
然后在搜索框中输入draw.io查询插件,点击安装
![](/d/file/p/2023/02/569061623536373007.png)
安装好后,新建一个test.drawio文件
![](/d/file/p/2023/02/8307948880087471106.png)
接着选中test.drawio文件,进入编辑模式
![](/d/file/p/2023/02/6039744205493802654.png)
左侧有各种图形,随意选择,就可以绘制流程图了
![](/d/file/p/2023/02/5092577512435168491.png)
绘制好后,点击文件→嵌入→svg
![](/d/file/p/2023/02/2981454904738901403.png)
下面再选择嵌入
![](/d/file/p/2023/02/4177674340099480536.png)
复制svg代码
![](/d/file/p/2023/02/4786404550156789615.jpg)
将复制的svg代码粘贴到html代码中
![](/d/file/p/2023/02/7141920743031148979.png)
打开html网页,就可以看到绘制的流程图了
![](/d/file/p/2023/02/8104987294521250824.png)
点击网页上的图片,就可以跳转页面
在该页面可以放大缩小流程图
在这里,我们选择点击右下角的铅笔图案,跳转网页编辑页面
![](/d/file/p/2023/02/9049204833595708829.png)
在网页编辑页面,又可以对流程图重新做编辑
![](/d/file/p/2023/02/6230663069484517926.png)
这里可以选择File→Save,最后选择png格式图片保存
![](/d/file/p/2023/02/1421623476097378837.png)
![](/d/file/p/2023/02/867037713836224688.png)
以上这篇文章就是visual studio code绘制流程图的方法,更多精彩教程请关注设·集合小编!
相关文章
广告位
评论列表