You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
107 lines
2.4 KiB
107 lines
2.4 KiB
# markmap-autoloader
|
|
|
|
|
|
|
|
|
|
|
|
Load markmaps automatically in HTML.
|
|
|
|
## Usage
|
|
|
|
HTML:
|
|
|
|
```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>
|
|
```
|
|
|
|
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:
|
|
|
|
```html
|
|
<script src="https://cdn.jsdelivr.net/npm/markmap-autoloader@latest"></script>
|
|
```
|
|
|
|
To use specific version (here: `0.14.3`) of `mark-autoloader`:
|
|
|
|
```html
|
|
<script src="https://cdn.jsdelivr.net/npm/markmap-autoloader@0.14.3"></script>
|
|
```
|
|
|
|
Load manually:
|
|
|
|
```html
|
|
<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>
|
|
```
|
|
|
|
Disable built-in plugins:
|
|
|
|
```html
|
|
<script>
|
|
window.markmap = {
|
|
autoLoader: {
|
|
transformPlugins: [],
|
|
},
|
|
};
|
|
</script>
|
|
<script src="https://cdn.jsdelivr.net/npm/markmap-autoloader"></script>
|
|
```
|
|
|
|
## API
|
|
|
|
### Options
|
|
|
|
If `window.markmap.autoLoader` is defined before this package is loaded, it will be regarded as autoLoader options.
|
|
|
|
- `autoLoader.manual` _boolean_ default as `false`
|
|
|
|
Whether to render markmaps manually. If false, all elements matching `.markmap` will be rendered once this package loads or DOMContentLoaded is emitted, whichever later.
|
|
|
|
- `autoLoader.transformPlugins` _ITransformPlugin[]_
|
|
|
|
Override built-in plugins if provided. Set to `[]` to disable all built-in plugins for auto-loader.
|
|
|
|
- `autoLoader.onReady` _function_
|
|
|
|
Callback when markmap-lib/markmap-view and their dependencies are loaded. We can tweak global options in this callback.
|
|
|
|
### markmap.autoLoader.renderAll()
|
|
|
|
Render all elements matching `.markmap`.
|
|
|
|
### markmap.autoLoader.renderAllUnder(el)
|
|
|
|
Render all elements matching `.markmap` under container `el`.
|
|
|
|
### markmap.autoLoader.render(el)
|
|
|
|
Render markmap in `el`, which is supposed to have the class name `markmap`.
|