JSON Options

JSON options are a group of options that can be serialized as JSON and embedded in Markdown.

Usage

Markdown Frontmatter

JSON options can be added to the frontmatter of your Markdown file as the value of markmap.

For example:

---
markmap:
  color:
    - blue
  # other options
---

Markdown content here

Markmap for VSCode

JSON options can be set as Default Options in gera2ld.markmap-vscode, so you don't have to modify frontmatter of each file.

For example:

{
    "color": ["blue"]
}

Option List

color

Type: string | string[], default: d3.schemeCategory10

A list of colors to use as the branch and circle colors for each node.

If none is provided, d3.schemeCategory10 will be used.

colorFreezeLevel

Type: number, default: 0

Freeze color at the specified level of branches, i.e. all child branches will use the color of their ancestor node at the freeze level.

0 for no freezing at all.

duration

Type: number, default: 500

The animation duration when folding/unfolding a node.

maxWidth

Type: number, default: 0

The max width of each node content. 0 for no limit.

initialExpandLevel

Type: number, default: -1

The maximum level of nodes to expand on initial render.

-1 for expanding all levels.

extraJs

Type: string[], default: none

A list of JavaScript URLs. This is useful to add more features like Katex plugins.

extraCss

Type: string[], default: none

A list of CSS URLs. This is useful to add more features like Katex plugins.

zoom

Type: boolean, default: true

Whether to allow zooming the markmap.

pan

Type: boolean, default: true

Whether to allow panning the markmap.

htmlParser

Type: { selector: string }

Pass options to the internal HTML parser, for example to override the default selectors for elements to display.

spacingHorizontal

Type: number, default: 80

spacingVertical

Type: number, default: 5

Why?

If you are not a developer, you may skip this part.

Markmap has its own options which can either be passed on create or afterwards.

Markmap.create(svg, markmapOptions, data);

However, markmapOptions is a low-level object including complicated logic that can hardly be serialized, so it is not portable.

jsonOptions is introduced for portability but as a tradeoff it can only stand for a subset of markmapOptions.

jsonOptions can be converted to markmapOptions with a single function call:

import { deriveOptions } from 'markmap-view';

const markmapOptions = deriveOptions(jsonOptions);