Mark down drawing syntax

The following syntax is tested in NetEase cloud notes.

The marker position of the drawing is three single quotation mark ' start ', note the single quotation mark of the English half angle, and the following characters are correct in the English half-angle state.

Sogou Input method to pay special attention, remember shift switch in English shortcut keys changed, otherwise painful death.

The following is the MD code

```

Graph LR
A ((a This is round))-.-> B
B{b This is the text inserted by the diamond}==>| |c
C==>f> This is the flag type]
Node--text-to-node B
```

Graph--keyword does not explain
TB-top to bottom from top to bottom
BT-Bottom to top bottom-up
LR-Left to right
RL--Right to left

Node-->| Word on the connection line | Node

-.-> Dashed lines

---a line without arrows
= = Line of the bold body

>TEXT] Flag Type
[Text] Rectangle
(text) Rounded Rectangle
((text)) round
{text} Diamond

If special characters are encountered, enter quotation marks to mark

For example

```
Graph LR
A["a leader (colon): #quot;"]-->b["a heart: #9829;"]

```

Next is the subreport is more keyword subgraph

```
Graph TB
Subgraph One
A1-->a2
End
Subgraph
B1-->b2
End
Subgraph Three
C1-->c2
End
C1-->a2
A1==>b2
B1-.->c2

```

Callback events after clicking on a node

<script>
var callback = function () {
Alert (' callback function ' is triggered. ‘);
}
<script>

```
Graph LR;
a-->b;
Click A Callback "Test callback function"
Click B "Http://www.sci99.com" "Tap will jump to page"

```

Calling CSS Styles
```
Graph LR
ID1 (Start)-->id2 (Stop)
Style ID1 fill: #f9f, stroke: #333, stroke-width:4px;
Style Id2 fill: #ccf, stroke: #f66, Stroke-width:2px,stroke-dasharray:5, 5;
```

```
Graph LR
A[hard Edge]-->| Link text| B (Round Edge)
B--C{decision}
C-->| one| D[result One]
C-->| two| E[result)

```

Mark down drawing syntax