Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Flow chart scaling and alignment issues #242

Open
OSCAR2766 opened this issue Sep 22, 2022 · 7 comments
Open

Flow chart scaling and alignment issues #242

OSCAR2766 opened this issue Sep 22, 2022 · 7 comments

Comments

@OSCAR2766
Copy link

OSCAR2766 commented Sep 22, 2022

image
The more branches the flowchart has, the arrows will automatically scale, but the stretch is too long. And keep the text boxes from being vertically aligned.

a1=>parallel: 新品交接
a2=>parallel: 进行厂家评
估,安排验厂
和落实意向单
a3=>operation: 录入供应商和
产品信息同时
签署经销协议
a4=>parallel: 通知PM产品
专员及开发人
员可下需求单
a5=>operation: 转化成销售订单
后生成采购单下
达给供应商
a6=>parallel: 安排首款申请并跟
进供应商确认交期
a7=>parallel: 跟进产品及包材产
前样并进行批核
a8=>parallel: 提供DI生成UDI;
进行FDA列示
a9=>parallel: 建立BOM表
a10=>parallel: 安排验货
a11=>parallel: 申请尾款,安

排出货
a12=>operation: 发货通知
a13=>operation: 录入GUDID资料
a14=>operation: 到货通知
a15=>operation: 成本核算

b1=>operation: 项目交
接表,
产品样
品及报价
b2=>operation: 供应商
审厂
b3=>operation: PM通知产品
专员下达采购
需求
b4=>operation: 财务付款
b5=>operation: 配合跟进
开发人员
确认新品
产前样
b6=>operation: 各部门
配合确认
产品稿件
b7=>operation: 厂家及法规申述同
事根据定稿产品名/型号进行列示
b8=>operation: 产品专员梳理给出BOM信息
b9=>operation: 品质部安
排验货
b10=>operation: 财务付款
物流安排运输
b11=>operation: 物流提供相关费用清单

c1=>condition: 资料是
否准确
清晰
c2=>condition: 验厂评分(是
否正规/符合要求)
c3=>condition: 货物是否合格

d1=>operation: 继续与
供应商
沟通补充
d2=>operation: 整改或
寻找新
供应商
d3=>operation: 安排返工修正
aa=>operation: 转折框

a1(path1,bottom)->aa->a2
a1(path2,right)->b1

a2(path1,bottom)->a3
a2(path2,right)->b2

b1(right)->c1
c1(yes)->a2
c1(no,right)->d1->a2

b2(right)->c2
c2(yes,bottom)->a3
c2(no,right)->d2(top)->b2

a3->a4
a4(path1,bottom)->a5
a4(path2,right)->b3->a5

a5->a6
a6(path1)->a7
a6(path2,right)->b4

a7(path1)->a8
a7(path2,right)->b5(right)->b6->a8
a8(path1)->a9
a8(path2,right)->b7

a9(path1)->a10
a9(path2,right)->b8

a10(path1,bottom)->a11
a10(path2,right)->b9(right)->c3

c3(yes,bottom)->a11
c3(no,right)->d3(top)->b9

a11(path1)->a12->a13->a14->a15(right)->b11
a11(path2,right)->b10
@OSCAR2766
Copy link
Author

According to my attempts, by reducing the width of the contents in operation or condition, I can reduce the zoom a little, but the overall presentation is still not good

@OSCAR2766
Copy link
Author

The end tag can also be used to bring the text box closer, but the condition is still far away

@OSCAR2766
Copy link
Author

image

a1=>parallel: 新品交接
a2=>parallel: 进行厂家评
估,安排验厂
和落实意向单
a3=>operation: 录入供应商和
产品信息同时
签署经销协议
a4=>parallel: 通知PM产品
专员及开发人
员可下需求单
a5=>operation: 转化成销售订单
后生成采购单下
达给供应商
a6=>parallel: 安排首款申请并跟
进供应商确认交期
a7=>parallel: 跟进产品及包材产
前样并进行批核
a8=>parallel: 提供DI生成UDI;
进行FDA列示
a9=>parallel: 建立BOM表
a10=>parallel: 安排验货
a11=>parallel: 申请尾款,安

排出货
a12=>operation: 发货通知
a13=>operation: 录入GUDID资料
a14=>operation: 到货通知
a15=>operation: 成本核算

b1=>end: 项目交
接表,
产品样
品及报价
b2=>end: 供应商
审厂
b3=>end: PM通知产品
专员下达采购
需求
b4=>end: 财务付款
b5=>end: 配合跟进
开发人员
确认新品
产前样
b6=>operation: 各部门
配合确认
产品稿件
b7=>end: 厂家及法规申述同
事根据定稿产品名/型号进行列示
b8=>operation: 产品专员梳理给出BOM信息
b9=>end: 品质部安
排验货
b10=>end: 财务付款
物流安排运输
b11=>operation: 物流提供相关费用清单

c1=>condition: 资料是
否准确
清晰
c2=>condition: 验厂评
分(是
否正规/
符合要求)
c3=>condition: 货物是否合格

d1=>end: 继续与
供应商
沟通补充
d2=>end: 整改或
寻找新
供应商
d3=>operation: 安排返工修正
aa=>operation: 转折框

a1(path1,bottom)->aa->a2
a1(path2,right)->b1

a2(path1,bottom)->a3
a2(path2,right)->b2

b1(right)->c1
c1(yes)->a2
c1(no,right)->d1->a2

b2(right)->c2
c2(yes,bottom)->a3
c2(no,right)->d2(top)->b2

a3->a4
a4(path1,bottom)->a5
a4(path2,right)->b3->a5

a5->a6
a6(path1)->a7
a6(path2,right)->b4

a7(path1)->a8
a7(path2,right)->b5(right)->b6->a8
a8(path1)->a9
a8(path2,right)->b7

a9(path1)->a10
a9(path2,right)->b8

a10(path1,bottom)->a11
a10(path2,right)->b9(right)->c3

c3(yes,bottom)->a11
c3(no,right)->d3(top)->b9

a11(path1)->a12->a13->a14->a15(right)->b11
a11(path2,right)->b10

@OSCAR2766
Copy link
Author

OSCAR2766 commented Sep 22, 2022

Maybe we can take a look at this
#115

@OSCAR2766
Copy link
Author

OSCAR2766 commented Sep 22, 2022

Maybe we can take a look at this #115

(align-next=no) seems to be not aligned in my flowchart

@adrai
Copy link
Owner

adrai commented Sep 22, 2022

Like already said several times, flowchart.js is only for simple charts...
btw: you have a lot of end nodes... normaly there is only 1 start and 1 end node...
I'm not actively using this module anymore... so feel free if you want to provide a PR to optimize this...

@spiritualgeek
Copy link

Why not archive this project rather?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants