跳到主要内容

安装与使用

安装​

npm i mind-elixir -S

使用​

import MindElixir from 'mind-elixir'

let options = {
  el: '#map', // or HTMLDivElement
}

let mind = new MindElixir(options)

// create new map data
const data = MindElixir.new('new topic')
mind.init(data)

要使用 Mind Elixir，在 options 中只要传入一个 el（代表挂载的目标 DOM 元素）即可。更多配置可以查阅完整配置。

注意

因为 Mind Elixir 挂载时高度为容器高度的 100%，所以请务必设置容器高度，否则造成显示异常。

<div id="map"></div>
<style>
  #map {
    height: 500px;
    width: 100%;
  }
</style>

对思维导图的操作​

  • 操作与常见思维导图应用基本一致
  • 快捷键可见快捷键章节
  • 鼠标左键可拖动节点，或多选节点
  • 鼠标右键可拖动画布
  • 右键选择“连接”后再点击另一个节点，可连接两个节点

数据导出与更新​

用户对思维导图的操作后，数据随即改变，可以调用 getData 方法获取最新数据。数据格式可见数据导出。

const data = mind.getData()

有需要使用整组新数据刷新当前思维导图时，可以使用 refresh 方法。

mind.refresh(data)