markmap-autoloader

Load markmaps automatically in HTML.

Usage

HTML:

<style>
  .markmap {
    position: relative;
  }
  .markmap > svg {
    width: 100%;
    height: 300px;
  }
</style>

<div class="markmap">
  <script type="text/template">
    - markmap
      - autoloader
      - transformer
      - view
  </script>
</div>
Copy

Note that <script type="text/template"> is optional, for the content inside to be invisible before the markmap is rendered.

Autoload all elements matching .markmap, using latest autoloader version:

<script src="https://cdn.jsdelivr.net/npm/markmap-autoloader@latest"></script>
Copy

To use specific version (here: 0.14.3) of mark-autoloader:

<script src="https://cdn.jsdelivr.net/npm/markmap-autoloader@0.14.3"></script>
Copy

Load manually:

<script>
  window.markmap = {
    autoLoader: { manual: true },
  };
</script>
<script src="https://cdn.jsdelivr.net/npm/markmap-autoloader"></script>
<script>
  // Render in 5s
  setTimeout(() => {
    markmap.autoLoader.renderAll();
  }, 5000);
</script>
Copy

Disable built-in plugins:

<script>
  window.markmap = {
    autoLoader: {
      transformPlugins: [],
    },
  };
</script>
<script src="https://cdn.jsdelivr.net/npm/markmap-autoloader"></script>
Copy