owned this note   changed 2 months ago  
Linked with GitHub

中文教學

How to use MathJax & UML

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
Check the source of this note
Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →

You can create various types of charts and mathematical expressions on HackMD. Refer to the example below.

MathJax

You can render LaTeX mathematical expressions using MathJax, as on math.stackexchange.com, except the space after the start $ and the space before the end $ are not allowed in the inline math:

The Gamma function satisfying \(\Gamma(n) = (n-1)!\quad\forall n\in\mathbb N\) is via the Euler integral

\[ x = {-b \pm \sqrt{b^2-4ac} \over 2a}. \]

\[ \Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,. \]

More information about LaTeX mathematical expressions.

Click here

Image Not Showing Possible Reasons
  • The image file may be corrupted
  • The server hosting the image is unavailable
  • The image path is incorrect
  • The image format is not supported
Learn More →
.

Mind map

# markmap

## Links

- <https://markmap.js.org/>
- [GitHub](https://github.com/gera2ld/markmap)

## Related

- [coc-markmap](https://github.com/gera2ld/coc-markmap)
- [gatsby-remark-markmap](https://github.com/gera2ld/gatsby-remark-markmap)

## Features

- links
- **inline** ~~text~~ *styles*
- multiline
  text
- `inline code`
-
    ```js
    console.log('code block');
    ```

UML Diagrams

Sequence Diagrams

You can render sequence diagrams like this:

Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!
Note left of Alice: Alice responds
Alice->Bob: Where have you been?

Graphviz

digraph hierarchy {

                nodesep=1.0 // increases the separation between nodes

                node [color=Red,fontname=Courier,shape=box] //All nodes will this shape and colour
                edge [color=Blue, style=dashed] //All the lines look like this

                Headteacher->{Deputy1 Deputy2 BusinessManager}
                Deputy1->{Teacher1 Teacher2}
                BusinessManager->ITManager
                {rank=same;ITManager Teacher1 Teacher2}  // Put them on the same level
}

Learn more about 'Graphviz'

Abc

X:1
T:Speed the Plough
M:4/4
C:Trad.
K:G
|:GABc dedB|dedB dedB|c2ec B2dB|c2A2 A2BA|
GABc dedB|dedB dedB|c2ec B2dB|A2F2 G4:|
|:g2gf gdBd|g2f2 e2d2|c2ec B2dB|c2A2 A2df|
g2gf g2Bd|g2f2 e2d2|c2ec B2dB|A2F2 G4:|

More information about sequence diagrams syntax here.
More information about flow charts syntax here.
More information about graphviz syntax here
More information about mermaid syntax here
More information about abc syntax here

Select a repo