Mark-Map Widget

Markmap is a combination of Markdown and mindmap. It parses Markdown content, extracts its intrinsic hierarchical structure, and renders an interactive mindmap, aka ‘markmap’. You can use the ‘Mark-Map widget’ to visualize your MD documents as mindmaps.

We'll cover the following

This is what it looks like:

Press + to interact

You can edit the MD in the text window to visualize your markmap however you see fit.

Learners won’t see the code; the diagram will be rendered directly.

You can adjust the width and height as per the requirement.

Example

Press + to interact
# markmap
## Links
- <https://markmap.js.org/>
- [GitHub](https://github.com/gera2ld/markmap)
## Related Projects
- [coc-markmap](https://github.com/gera2ld/coc-markmap)
- [gatsby-remark-markmap](https://github.com/gera2ld/gatsby-remark-markmap)
## Features
- links
- **strong** ~~del~~ *italic* ==highlight==
- multiline
  text
- `inline code`
-
    ```js
    console.log('code block');
    ```
- Katex
  - $x = {-b \pm \sqrt{b^2-4ac} \over 2a}$
  - [More Katex Examples](#?d=gist:af76a4c245b302206b16aec503dbe07b:katex.md)
- Now we can wrap very very very very long text based on `maxWidth` option

The above MD text will render the following diagram.