Mind Elixir 思维导图导出图片教程：使用 @zumer/snapdom 高质量导出 JPG/PNG

Export Mind Map as Image by ssshooter/mind-elixir-core

3,000 GitHub Stars

GitHub

安装命令

npx skills add https://github.com/ssshooter/mind-elixir-core --skill 'Export Mind Map as Image'

数据可视化开发 JavaScript 框架

🇨🇳中文介绍

将思维导图导出为图片

Mind Elixir 推荐使用 @zumer/snapdom 进行高质量的图片导出。该工具允许您直接将 SVG 节点转换为图片格式。

1. 安装

将 @zumer/snapdom 安装为依赖项。

npm install @zumer/snapdom

2. 使用方法

使用 snapdom 函数捕获思维导图节点并下载它们。

import { snapdom } from '@zumer/snapdom'
// 假设 `mind` 是您的 MindElixir 实例

const downloadImage = async () => {
  // 1. 捕获节点
  const result = await snapdom(mind.nodes)

  // 2. 下载为 JPG 或 PNG
  await result.download({
    format: 'jpg', // 或 'png'
    filename: 'mind-map-export',
  })
}

3. 创建触发器

您可以在用户界面中添加一个按钮来触发此功能。

<button id="export-btn">导出图片</button>

<script>
  document.getElementById('export-btn').addEventListener('click', downloadImage)
</script>

广告位招租

在这里展示您的产品或服务

触达数万 AI 开发者，精准高效

联系我们

🇺🇸English

Export Mind Map as Image

Mind Elixir recommends using @zumer/snapdom for high-quality image exports. This tool allows you to convert the SVG nodes directly into image formats.

1. Installation

Install @zumer/snapdom as a dependency.

npm install @zumer/snapdom

2. Usage

Use the snapdom function to capture the mind map nodes and download them.

import { snapdom } from '@zumer/snapdom'
// Assuming `mind` is your MindElixir instance

const downloadImage = async () => {
  // 1. Capture the nodes
  const result = await snapdom(mind.nodes)

  // 2. Download as JPG or PNG
  await result.download({
    format: 'jpg', // or 'png'
    filename: 'mind-map-export',
  })
}

3. Creating a Trigger

You can add a button to your UI to trigger this function.

<button id="export-btn">Export Image</button>

<script>
  document.getElementById('export-btn').addEventListener('click', downloadImage)
</script>

Note : The built-in mind.exportSvg() method is deprecated. Please use the method above for new projects.

Weekly Installs

–

Repository

ssshooter/mind-…xir-core

GitHub Stars

3.0K

First Seen

–

Security Audits

Gen Agent Trust HubWarn SocketPass SnykPass