1) Add CSS classes to box; 2) "stroke-dasharray":15px for Arrows not working; 3)Arrow length for each box; 4) Better Spacing to avoid overlapping boxes

Adrai and team, you have created something wonderful and useful here! Thank you!

I am not able to PR myself as I am not that good with js, but I did study the description for the tool and have a few questions that I was not able to find answers for. Here they are:

**1) Add CSS Classes to Boxes & Arrows in our code**
I understand that when creating each box, the name we provide for the box in the code is added to the html as the ID of that box element (but not the Arrow element). This is great. I was wondering if we can somehow associate css classes in the code while we are creating the boxes and arrows. If this is something you can consider adding in the next release that would be awesome. If we are able to add classes to arrows then we might be able to tinker with the arrow styles (curved, etc.).

**2) "stroke-dasharray":15px for Arrows not working;**

I tried using dasharray property for svg lines with different variations (5, 5px, "5px", '5px'), but nothing seems to work. Please advise how we could make this a dashed line arrow, or otherwise change the properties of these arrows.

**3) Arrow length for each arrow specified in code**
Just like (align-next=no) will bring the boxes closer in the same line, would it be possible to preferably specify the length of the arrow in our code (or atleast add standard box sized offset so we can add more space between boxes on the same line)?

**4) Better spacing consideration/algorithm to avoid overlapping boxes:**
We are considering using this tool to draw flowcharts which are dynamically drawn and its not a case where we know what the tree structure is going to look like. Currently, if for example there are several decision boxes connected in a row (assume they are connected with each other on the 'no' arrow), and if the branches coming out on the 'yes' arrow also divide in a few branches further down the row.... what we find is that the boxes are at times drawn overlapping each other. Its probably easy to explain with the code example below:

--------

st=>start: start-box
e=>end: End-box
op1=>operation: op1-box
sub1=>subroutine: sub1-box
cond(align-next=no)=>condition: cond-box?
io=>inputoutput: io-box
sub2=>subroutine: sub2-box
op2=>operation: op2-box
cond2=>condition: cond2-box
cond3=>condition: cond3-box
op3=>operation: op3-box
sub3=>subroutine: sub3-box
sub4=>subroutine: sub4-box
io2=>inputoutput: io2-box

cond4=>condition: cond4-box
cond5=>condition: cond5-box
op4=>operation: op4-box
op5=>operation: op5-box
op6=>operation: op6-box
op7=>operation: op7-box
op8=>operation: op8-box
op9=>operation: op9-box

st->op1
op1->sub1
sub1->cond
cond(yes)->io
io->op2
op2->cond2
cond2(no)->cond3
cond3(no,bottom)->op2
cond3(yes)->op3
op3(right)->op2
cond2(yes)->sub3
sub3->sub4->io2
io2->e

cond(no)->cond4
cond4(no)->cond5
cond5(no)->sub2

cond4(yes)->op4
op4->op5
op5->op6

cond5(yes)->op7
op7->op8
op8->op9

sub2(right)->op1

st@>op1({"stroke-dasharray":5,"stroke":"Blue","stroke-width":6,"arrow-end":"classic-wide-long"})@>sub1({"stroke":"Red"})@>cond({"stroke":"Red"})@>io({"stroke":"Red"})@>op2({"stroke":"Red"})@>cond2({"stroke":"Red"})@>sub3({"stroke":"Red"})@>sub4({"stroke":"Red"})@>io2({"stroke":"Red"})@>e({"stroke":"Red","stroke-width":6,"arrow-end":"classic-wide-long"})

------
As you can see with this code, the op6-box is drawn over the cond3-box.


I also tried changing the _order_ in which the boxes are drawn, but it still draws the same exact diagram.
So, the questions are:
4a) Can we somehow avoid the overlapping of boxes even if it means drawing them far apart?
4b) Can we some how control the order in which the boxes are drawn and that way manage how the diagram turns out (assuming the drawing algorithm analyses what is already drawn to figure out the best coordinates location for the next box).

I am sure others have run into these issues and if fixed, they can greatly improve the tool and help everyone.

Thanks again for your hard work.
Cheers!