Kylin operating system (kylinos) from entry to master - Office Environment - Chapter 29 Visio Substitution and Flowchart Drawing

0. Basic environment

Category: Notebook Model: Great Wall of China UF712
Hardware platform: Feiteng processor (ArmV8 instruction set)
System: Galaxy Kirin OS V10 SP1 (2203)
Key words:
Xinchuang, Kylin system, linux, PKS, Galaxy Kylin, Feiteng, arm64, arm, Visio, BPMN, Drawio, markdown, vscode

1. Requirement Background

Under Windows, we can use visio to draw the desired graphics such as architecture diagrams and flowcharts. But under Linux, especially in Feiteng environment, there is no better substitute for VISIO.
Edraw in the current app store may be the best alternative, but it needs to be purchased. From the perspective of free and easy to use, this article provides you with a good and free solution from the perspective of drawio, redhat bpmn editor, typora, visual studio code, and mermaid.

2. The best alternative to drawio for visio

Install visual studio code first
Then in visual studio code, install the drawio plugin

To test, create a new file with the file name .drawio on the desktop, and then use vscode to open the specified file, the effect is as follows.

3.bpmn and flow chart

3.1 vscode plugin mode

As shown in the figure, install the bpmn editor (provided by redhat)

Create a new file name .bpmn on the desktop, and then open it with vscode, the effect is shown in the figure below

3.2 Use markdown and mermaid to realize the drawing of flowcharts and other diagrams

Note: This method is most suitable for technical personnel, and can be combined with GIT to achieve version change management

3.2.1 Using vscode markdown to draw flowcharts

Mermaid
Mermaid lets you create diagrams and visualizations using text and code.
https://mermaid-js.github.io/
https://mermaid.live/
Graph types supported by mermaid

Install markdown preview mermaid support in vscode

After the installation is successful, the built-in markdown can support graphics drawing.

Detailed list support here
https://mermaid-js.github.io/mermaid/#/./integrations
Markdown Preview Mermaid Support Install this one to take full advantage of the built-in markdown editor

 Vs Code
    Markdown Preview Mermaid Support
    Mermaid Preview
    Mermaid Markdown Syntax Highlighting
    Mermaid Editor
    Mermaid Export
    Markdown PDF
    Preview
    Preview Sequence Diagrams

3.2.2 Using typora

use typora

The following is the free version, you can also download the official version of arm64, but for individuals, the free version is enough.
https://download.typora.io/linux/typora_0.11.18_arm64.deb
If the above link cannot be downloaded, you can get it through my NAS or QQ group
http://gofile.me/4i7bC/DwvA6NxH7

4. Use Edraw Icons

You can directly install the Edraw icon in the application market, and free is enough. (the fee is a bit more expensive)

The use of drawio, bpmn editor, and mermaid has solved our needs very well, but there is a certain learning cost in this process, especially the markdown method. It is a particularly good way for technical-related personnel.

Kylin system column:
https://segmentfault.com/blog/kylinos
Article published in SegmentFault
Contact email: [e-mail]
Group: 662512340 The relevant information in the article can be obtained through the group file or request assistance from the group owner. Release log:
20220727 starter