flowchart.js icon indicating copy to clipboard operation
flowchart.js copied to clipboard

Code in javascript direct?

Open robertleeplummerjr opened this issue 6 years ago • 4 comments

What a fantastic library! I'm curious, however, if we can code in js directly to achieve the same output. It'd be really nice to not have to learn a new language and get the same output. Here is an example I quickly converted from the README.md:

import {
  start,
  end,
  operation,
  subroutine,
  condition,
  inputoutput,
  parallel }  from 'flowchart.js';
// st=>start: Start:>http://www.google.com[blank]
const st = start({ title: 'Start', url: 'http://www.google.com', target: 'blank' });
// e=>end:>http://www.google.com
const e = end({ href: 'http://www.google.com' });
// op1=>operation: My Operation
const op1 = operation({ title: 'My Operation' });
// sub1=>subroutine: My Subroutine
const sub1 = subroutine({ title: 'My Subroutine' });
// cond=>condition: Yes
// or No?:>http://www.google.com
const cond = condition({ title: 'Yes\nor No?', url: 'http://www.google.com' });
// io=>inputoutput: catch something...
const io = inputoutput({ title: 'catch something...' });
// para=>parallel: parallel tasks
const para = parallel({ title: 'parallel tasks' });
//
// st->op1->cond
st.link(op1).link(cond);
// cond(yes)->io->e
cond.yes.link(io).link(e);
// cond(no)->para
cond.no.link(para);
// para(path1, bottom)->sub1(right)->op1
para.path1.bottom.link(sub1.right).link(op1);
// para(path2, top)->op1
para.path2.top.link(op1);

robertleeplummerjr avatar Nov 22 '19 19:11 robertleeplummerjr

feel free to contribute 😉

adrai avatar Nov 22 '19 20:11 adrai

I did it . But need some unit-test ……

Maybe soon.

hanshou101 avatar Dec 27 '19 03:12 hanshou101

Code?

robertleeplummerjr avatar Dec 27 '19 12:12 robertleeplummerjr

@hanshou101 don't leave us hangin'

robertleeplummerjr avatar Jul 23 '20 14:07 robertleeplummerjr