mindmap/README.md

@web/mindmap

类 Xmind 体验的思维导图引擎，专注于展示逻辑分支。

特性

• 原生 ESM 驱动，无需构建即可在浏览器中使用。
• 支持自动布局算法。
• 高性能 SVG/DOM 渲染（1000+ 节点渲染耗时 < 50ms）。
• 支持节点的展开与折叠。
• 支持画布平移与缩放。

安装与使用

本模块不发布至 npmjs。请通过 loader.js 或 importmap 引入。

使用示例

import { Mindmap } from '@web/mindmap';

const mm = new Mindmap({
    container: document.getElementById('app'),
    data: {
        text: '根节点',
        children: [
            { text: '子节点 1' },
            { text: '子节点 2' }
        ]
    }
});

API

new Mindmap(options)

• options.container: HTMLElement, 容器元素。
• options.data: Object, 树形数据结构。
• options.nodeWidth: Number, 节点宽度 (默认 120)。
• options.nodeHeight: Number, 节点高度 (默认 40)。
• options.hGap: Number, 水平间距 (默认 60)。
• options.vGap: Number, 垂直间距 (默认 20)。

mm.addNode(parentId, text)

• 向指定 ID 或文本匹配的节点添加子节点。

mm.removeNode(nodeId)

• 删除指定 ID 或文本匹配的节点。