如何将Pyflowchart生成的文本输出转换为可视化流程图？

直接生成可查看的HTML文件（最简便） #

不用手动处理终端输出，直接用pyflowchart生成HTML文件：

python -m pyflowchart 2-4-8.py > flowchart.html

用浏览器打开生成的flowchart.html文件，就能直接看到图形化流程图。

在VS Code中渲染 #

1. 安装VS Code扩展，比如Flowchart Preview或Markdown Preview Enhanced
2. 新建Markdown文件，将终端输出的流程图文本用```flow代码块包裹：

op2=>operation: from netmiko import ConnectHandler
op4=>operation: from getpass import getpass
op6=>operation: from datetime import datetime
op8=>operation: import logging
op10=>operation: import snoop
sub12=>subroutine: logging.basicConfig(filename='script.log', filemode='w', 
level=logging.DEBUG, format='%(asctime)s - %(levelname)s - %(message)s')
op14=>operation: password = getpass()
op16=>operation: Device1 = {'device_type': 'juniper_junos', 'ip': 'x.x.x.x', 'username': 
'user', 'password': password}
op18=>operation: Device2 = {'device_type': 'juniper_junos', 'ip': 'x.x.x.x', 'username': 
'user', 'password': password}
op20=>operation: Device3 = {'device_type': 'juniper_junos', 'ip': 'x.x.x.x', 'username': 
'user', 'password': password}
op22=>operation: route = input('Route to verify: ')
op24=>operation: command = 'show version | match Hostname'
op26=>operation: command1 = f'show route {route} | match "localpref|>"'
op28=>operation: clear_txt = open('Interfaces.txt', 'w')
op30=>operation: Interfaces = open('Interfaces.txt', 'w')
cond33=>condition: for device in (Device1, Device2, Device3)
op126=>operation: net_connect = ConnectHandler(**device)
op128=>operation: output = net_connect.send_command(command)
op130=>operation: output1 = net_connect.send_command(command1)
op132=>operation: now = datetime.now().strftime('%d/%m/%Y %H:%M')
op134=>operation: head = ('-' * 65)
op136=>operation: dev = output.split()[(- 1)]
sub138=>subroutine: print(f'''{head}
{now} --> ### HOSTNAME: {dev} ###
{head}''', file=Interfaces)
op140=>operation: output1 = output1.replace(',', '').split('\n')
cond143=>condition: for line in output1
op180=>operation: line = line.split()
cond183=>condition: if ('localpref' in line)
op187=>operation: ldata = line[(line.index('localpref') + 1)]
cond192=>condition: if ('via' in line)
op196=>operation: vdata = line[(line.index('via') + 1)][:(- 2)]
op198=>operation: command2 = f'show interface {vdata} descriptions'
op200=>operation: output2 = net_connect.send_command(command2)
op202=>operation: ddata = output2[66:]
op204=>operation: result = f'{now} --> localpref {ldata} --> via {vdata} --> {ddata}'
sub206=>subroutine: print(result, file=Interfaces)
sub216=>subroutine: Interfaces.close()

op2->op4
op4->op6
op6->op8
op8->op10
op10->sub12
sub12->op14
op14->op16
op16->op18
op18->op20
op20->op22
op22->op24
op24->op26
op26->op28
op28->op30
op30->cond33
cond33(yes)->op126
op126->op128
op128->op130
op130->op132
op132->op134
op134->op136
op136->sub138
sub138->op140
op140->cond143
cond143(yes)->op180
op180->cond183
cond183(yes)->op187
op187->cond143
cond183(no)->cond192
op196->op198
op198->op200
op200->op202
op202->op204
op204->sub206
sub206->cond143
cond192(no)->cond143
cond143(no)->cond33
cond33(no)->sub216

3. 打开Markdown预览面板，即可看到渲染后的图形。

修复flowchart.js在线工具的使用方式 #

部分flowchart.js在线工具需要将文本放入指定模板中，示例模板如下：

var chart = flowchart.parse(`
// 此处粘贴你的完整流程图文本
`);
chart.drawSVG('svg');

将你的流程图内容替换掉注释部分，运行后即可生成SVG格式的流程图。

内容的提问来源于stack exchange，提问作者Kanzeon