MarkdownView

Label: :IA_Function
Property: type: MarkdownView
Inherits from: Function and View

The MarkdownView Function shows a document generated by Markdown.

• Function parameters

• Supported Markdown syntax

Function parameters

Key	Description	Default value	Possible values
markdown	Markdown to generate the document, following CommonMark syntax.		string
props.html	Enable HTML support to markdown	true	boolean
props.emoji	Enable emoji support to markdown	true	boolean
props.xhtml-out	Enable xhtml-out support to markdown	true	boolean
props.typographer	Enable some language-neutral replacement and quotes beautification	true	boolean
props.linkify	Autoconvert URL-like text to link	true	boolean
props.table-class	Customize class attribute of the <table>	table	string
props.breaks	Convert newline characters to <br>	true	boolean
props.task-lists	Enable GFM task list	true	boolean
props.toc	Enable automatic table of contents	false	boolean
props.anchorAttributes	Customize <a> tag attributes such as target: '_blank' or rel: 'nofollow'	{}	object

Supported Markdown syntax

Heading

# H1
## H2
### H3
#### H4
##### H5
###### H6

Heading with ID

### My Heading {#custom-id}

Bold

**bold text**

or

__bold text__

Italic

*italicized text*

or

_italicized text_

Blockquote

> blockquote
>> blockquote level 2
>>> blockquote level 3

Ordered List

1. First item
2. Second item
3. Third item

Unordered List

- First item
- Second item
- Third item

Bulleted list

* First level item
	* second level
		* third level
* Second item
* Third item

Inline code

`code`

Block code

```
{
  "firstName": "John",
  "lastName": "Doe",
  "age": 99
}
```

Block code with syntax highlight

Most usual languages are supported

Example

```json
{
  "firstName": "John",
  "lastName": "Doe",
  "age": 99
}
```

```cypher
MATCH (n:Person)-[r:TO]->(m:Something)
RETURN n,m,r
```

```javascript
let text = "This is my text";
console.log(text);
```

Horizontal Rule

---

Link

[Link](https://graphileon.com)
[Link with title](https://graphileon.com "Graphileon")
[Open in new tab link](https://graphileon.com){target="_blank"}
[Open in new tab link with title](https://graphileon.com "Graphileon"){target="_blank"}

Image

![alt text](image.jpg)
![50px square image](https://link.to/image.png =x50)
![50x50px image](https://link.to/image.png =50x50)

Table

| Syntax | Description |
| ----------- | ----------- |
| Header | Title |
| Paragraph | Text |

Footnote

Here's a sentence with a footnote. [^1]

[^1]: This is the footnote.

Definition List

Definition List Syntax

Term 1
  ~ Definition 1

Term 2
  ~ Definition 2a
  ~ Definition 2b

Strikethrough

~~The world is flat.~~

Task List

- [x] Write the press release
- [ ] Update the website
- [ ] Contact the media

Emoji

Emoji Cheat Sheet

:panda_face: :sparkles: :camel: :boom: :pig:

Highlight

I need to highlight these ==very important words==.

Subscript

H~2~O

Superscript

X^2^

Graphileon API response

Syntax

(ia-api "ia-name": "<ia-name-of-api-function-node>", "<param-name>": "<param-value>", "<param-name>": "<param-value>", ...)

Example

(ia-api "ia-name": "test", "input-id": "213")

Embed video

Syntax

@[youtube|vimeo|vine|prezi|osf](video_id or url)

Example

@[youtube](_kt6p7VZw2o)

or

@[youtube](https://www.youtube.com/watch?v=_kt6p7VZw2o&ab_channel=Graphileon)

Single HTML element

Syntax

[element]{attributes}

Example

[img]{src="image.jpg"}

Table of contents

[toc]

Alerts

::: success
You have got it.
:::

::: info
You have new mail.
:::

::: warning
You have new mail.
:::

::: error
Staying up all night is bad for health.
:::

Mermaid Flowchart

Flowchart Documentation

Example

```mermaid
graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;
```

AsciiMath

AsciiMath Documentation

Examples

Inline AsciiMath: `@(1/2[1-(1/2)^n])/(1-(1/2))=s_n@`

```AsciiMath
oint_Cx^3 dx+4y^2 dy

2=(((3-x)xx2)/(3-x))

sum_(m=1)^oosum_(n=1)^oo(m^2 n)/(3^m(m3^n+n3^m)
```

```ASCIIMath
phi_n(kappa) = 1/(4pi^2 kappa^2)
 int_0^oo (sin(kappa R))/(kappa R)
 del/(del R)
[R^2 (del D_n (R))/(del R)] del R
```

Echarts

Documentation for Echarts

Example

```echarts
{
  "width": 500,
  "height": 400,
  "series": [
    {
      "name": "访问来源",
      "type": "pie",
      "radius": "55%",
      "data": [
        {
          "value": 235,
          "name": "{{userName}}"
        },
        {
          "value": 274,
          "name": "联盟广告"
        },
        {
          "value": 310,
          "name": "邮件营销"
        },
        {
          "value": 335,
          "name": "直接访问"
        },
        {
          "value": 400,
          "name": "搜索引擎"
        }
      ]
    }
  ]
}
```

The width and height define the size for chart container.

Flowchart

Documentation for Flowchart.js

Example

```flowchart.js
st=>start: Start|past:>http://www.google.com[blank]
e=>end: End:>http://www.google.com
op1=>operation: My Operation|past
op2=>operation: Stuff|current
sub1=>subroutine: {{userName}}'s Subroutine|invalid
cond=>condition: Yes
or No?|approved:>http://www.google.com
c2=>condition: Good idea|rejected
io=>inputoutput: catch something...|request
para=>parallel: parallel tasks

st->op1(right)->cond
cond(yes, right)->c2
cond(no)->para
c2(true)->io->e
c2(false)->e

para(path1, bottom)->sub1(left)->op1
para(path2, right)->op2->e

st@>op1({"stroke":"Red"})@>cond({"stroke":"Red","stroke-width":6,"arrow-end":"classic-wide-long"})@>c2({"stroke":"Red"})@>op2({"stroke":"Red"})@>e({"stroke":"Red"})
```