JSPM

markmap-lib

0.7.7
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 18776
  • Score
    100M100P100Q137471F
  • License MIT

Visualize your Markdown as mindmaps with Markmap

Package Exports

  • markmap-lib
  • markmap-lib/dist/transform
  • markmap-lib/dist/view

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (markmap-lib) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

markmap-lib

NPM License Downloads

Visualize your Markdown as mindmaps.

This project is heavily inspired by Markmap.

Try it out.

Node.js >= 10 is required.

Usage

Command-line

Installation

Install globally:

$ yarn global add markmap-lib
# or
$ npm install markmap-lib -g

or use with npx:

$ npx markmap-lib

Commands

Usage: markmap [options] <input>

Create a markmap from a Markdown input file

Options:
  -V, --version          output the version number
  -o, --output <output>  specify filename of the output HTML
  --enable-mathjax       enable MathJax support
  --enable-prism         enable PrismJS support
  --no-open              do not open the output file after generation
  -h, --help             display help for command

Suppose we have a Markdown file named note.md.

Run the following command to get an interactive mindmap:

$ markmap note.md

# without global installation
$ npx markmap-lib note.md

Then we get note.html in the same directory, and hopefully it will be open in your default browser.

API

Installation

$ yarn add markmap-lib
# or
$ npm install markmap-lib

Transform

Transform Markdown to markmap data:

import { transform } from 'markmap-lib/dist/transform';

const data = transform(markdown);

Now we get the data for rendering in data.

Render

Render a markmap from transformed data:

Create an SVG element with explicit width and height:

<svg id="markmap" style="width: 800px; height: 800px"></svg>

Render a markmap to the SVG element:

import { Markmap } from 'markmap-lib/dist/view';

Markmap.create('#markmap', null, data);

// or pass an SVG element directly
const svgEl = document.querySelector('#markmap');
Markmap.create(svgEl, null, data);

Plugins

  • mathJax - MathJax
  • prism - PrismJS

Command-line

To enable plugins in command line, just add the related option, for example:

$ markmap note.md --enable-mathjax --enable-prism

API

loadPlugins loads necessary CSS and JavaScript files.

import { Markmap, loadPlugins } from 'markmap-lib/dist/view';

loadPlugins([
  'mathJax',
  'prism',
])
.then(() => {
  Markmap.create('#markmap', null, data);
});

MathJax options can be changed in the second parameter:

loadPlugins([
  'mathJax',
  'prism',
], {
  mathJax: {
    tex: {
      inlineMath: [['$','$'], ['\\(','\\)']],
    },
  },
});