### Use Slide mode in HackMD * Press `Share` button * Put `slideOptions` in `Customize slides options` ``` transition: slide theme: serif ``` --- ### References * [tutorials MathJax-and-UML](https://hackmd.io/c/tutorials/%2Fs%2FMathJax-and-UML) --- ### Math * You can use inline math by typing mathematical expression between two dollar symbols `$`. (e.g. Let use display an unit sphere in a space $S = \{ x \in \mathcal{R}^3 | \| x \| = 1 \}$ ) * Gamma function is defined by the following equation. $$ \Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,. $$ --- ### Code sections * How to split the word from a string and convert it into a new string with new separator for joining words * ```python def convert_str_with_newsep(s, sep): ss = s.strip() # remove leading / trailing spaces row = s.split() return sep.join(row) ``` --- ### Graphviz ```graphviz digraph dot { node [fontname=Arial, shape=box] edge [style=dashed] A->B } ``` --- ### Mermaid ```mermaid gantt title A Gantt Diagram section Section A task :a1, 2014-01-01, 30d Another task :after a1 , 20d section Another Task in sec :2014-01-12 , 12d anther task : 24d ``` --- ### UML Diagrams #### Sequence Diagrams You can render sequence diagrams like this: ```sequence 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? ``` --- ### Flow Charts Flow charts can be specified like this: ```flow st=>start: Start e=>end: End op=>operation: My Operation op2=>operation: lalala cond=>condition: Yes or No? st->op->op2->cond cond(yes)->e cond(no)->op2 ``` ---