FE/mind-map
1
0
Fork 0
mirror of https://github.com/wanglin2/mind-map.git synced 2026-02-17 14:04:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'feature' into main

Browse Source
This commit is contained in:
wanglin2
2023-05-05 21:34:40 +08:00
parent af9ee04aaf 7380fc60d5
commit 88c9f22a15
14 changed files with 196 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
README.md
View File

@@ -19,6 +19,12 @@
在线地址：[https://wanglin2.github.io/mind-map/](https://wanglin2.github.io/mind-map/)
另外也提供了客户端可供下载使用，支持`Windows`、`Mac`及`Linux`，下载地址：
Github：[releases](https://github.com/wanglin2/mind-map/releases)。
百度云盘：[地址](https://pan.baidu.com/s/1huasEbKsGNH2Af68dvWiOg?pwd=3bp3)。
# 特性
- [x] 插件化架构，除核心功能外，其他功能作为插件提供，按需使用，减小打包体积

2
index.html
View File

File diff suppressed because one or more lines are too long

2
web/src/pages/Doc/catalogList.js
View File

@@ -10,7 +10,7 @@ let langList = [
path: 'en'
}
]
let StartList = ['introduction', 'start', 'deploy', 'translate', 'changelog']
let StartList = ['introduction', 'start', 'deploy', 'client', 'translate', 'changelog']
let CourseList = new Array(19).fill(0).map((_, index) => {
return 'course' + (index + 1)
})

2
web/src/pages/Doc/en/introduction/index.md
View File

@@ -3,6 +3,8 @@
`simple-mind-map` is a simple and powerful web mind map library, not dependent on any specific framework. Can help you quickly develop mind mapping products.
> If you just want to use mind mapping, you can also use the demo of this project as a regular online mind mapping tool. Click on the 【Online Demo】 in the upper right corner to start using it.
>
> Additionally, a client is provided for download, support `Windows`、`Mac` and `Linux`, [Click here to learn more](/mind-map/#/doc/zh/client)。
## Features

37
web/src/pages/Doc/en/introduction/index.vue
View File

@@ -4,24 +4,25 @@
<p><code>simple-mind-map</code> is a simple and powerful web mind map library, not dependent on any specific framework. Can help you quickly develop mind mapping products.</p>
<blockquote>
<p>If you just want to use mind mapping, you can also use the demo of this project as a regular online mind mapping tool. Click on the 【Online Demo】 in the upper right corner to start using it.</p>
<p>Additionally, a client is provided for download, support <code>Windows</code>、<code>Mac</code> and <code>Linux</code>, <a href="/mind-map/#/doc/zh/client">Click here to learn more</a>。</p>
</blockquote>
<h2>Features</h2>
<ul>
<li><input type="checkbox" id="checkbox216" checked="true" /><label for="checkbox216">Plugin architecture. In addition to core functions, other functions are provided as plugins, which can be used as needed to reduce the overall volume</label></li>
<li><input type="checkbox" id="checkbox217" checked="true" /><label for="checkbox217">Supports six types of structures: logical structure diagrams, mind maps,</label>
<li><input type="checkbox" id="checkbox90" checked="true" /><label for="checkbox90">Plugin architecture. In addition to core functions, other functions are provided as plugins, which can be used as needed to reduce the overall volume</label></li>
<li><input type="checkbox" id="checkbox91" checked="true" /><label for="checkbox91">Supports six types of structures: logical structure diagrams, mind maps,</label>
organizational structure diagrams, directory organization diagrams, timeline, and fishbone diagrams</li>
<li><input type="checkbox" id="checkbox218" checked="true" /><label for="checkbox218">Built-in multiple themes and allows for highly customized styles, and support register new themes</label></li>
<li><input type="checkbox" id="checkbox219" checked="true" /><label for="checkbox219">Supports shortcuts</label></li>
<li><input type="checkbox" id="checkbox220" checked="true" /><label for="checkbox220">Node content supports images, icons, hyperlinks, notes, tags, and</label>
<li><input type="checkbox" id="checkbox92" checked="true" /><label for="checkbox92">Built-in multiple themes and allows for highly customized styles, and support register new themes</label></li>
<li><input type="checkbox" id="checkbox93" checked="true" /><label for="checkbox93">Supports shortcuts</label></li>
<li><input type="checkbox" id="checkbox94" checked="true" /><label for="checkbox94">Node content supports images, icons, hyperlinks, notes, tags, and</label>
summaries</li>
<li><input type="checkbox" id="checkbox221" checked="true" /><label for="checkbox221">Supports forward and backward navigation</label></li>
<li><input type="checkbox" id="checkbox222" checked="true" /><label for="checkbox222">Supports dragging and scaling</label></li>
<li><input type="checkbox" id="checkbox223" checked="true" /><label for="checkbox223">Supports right-click and Ctrl + left-click to select multiple items</label></li>
<li><input type="checkbox" id="checkbox224" checked="true" /><label for="checkbox224">Supports free dragging and dragging to adjust nodes</label></li>
<li><input type="checkbox" id="checkbox225" checked="true" /><label for="checkbox225">Supports various node shapes</label></li>
<li><input type="checkbox" id="checkbox226" checked="true" /><label for="checkbox226">Supports export to json, png, svg, pdf markdown, and import from json, xmind, markdown</label></li>
<li><input type="checkbox" id="checkbox227" checked="true" /><label for="checkbox227">Supports mini map、support watermark</label></li>
<li><input type="checkbox" id="checkbox228" checked="true" /><label for="checkbox228">Supports associative lines</label></li>
<li><input type="checkbox" id="checkbox95" checked="true" /><label for="checkbox95">Supports forward and backward navigation</label></li>
<li><input type="checkbox" id="checkbox96" checked="true" /><label for="checkbox96">Supports dragging and scaling</label></li>
<li><input type="checkbox" id="checkbox97" checked="true" /><label for="checkbox97">Supports right-click and Ctrl + left-click to select multiple items</label></li>
<li><input type="checkbox" id="checkbox98" checked="true" /><label for="checkbox98">Supports free dragging and dragging to adjust nodes</label></li>
<li><input type="checkbox" id="checkbox99" checked="true" /><label for="checkbox99">Supports various node shapes</label></li>
<li><input type="checkbox" id="checkbox100" checked="true" /><label for="checkbox100">Supports export to json, png, svg, pdf markdown, and import from json, xmind, markdown</label></li>
<li><input type="checkbox" id="checkbox101" checked="true" /><label for="checkbox101">Supports mini map、support watermark</label></li>
<li><input type="checkbox" id="checkbox102" checked="true" /><label for="checkbox102">Supports associative lines</label></li>
</ul>
<h2>Repository Catalog Introduction</h2>
<p>1.<code>simple-mind-map</code></p>
@@ -31,16 +32,16 @@ frameworks such as Vue and React, or without a framework.</p>
<p>This is an online mind map built using the <code>simple-mind-map</code> library and based
on <code>Vue2.x</code> and <code>ElementUI</code>. Features include:</p>
<ul>
<li><input type="checkbox" id="checkbox229" checked="true" /><label for="checkbox229">Toolbar, which supports inserting and deleting nodes, and editing node</label>
<li><input type="checkbox" id="checkbox103" checked="true" /><label for="checkbox103">Toolbar, which supports inserting and deleting nodes, and editing node</label>
images, icons, hyperlinks, notes, tags, and summaries</li>
<li><input type="checkbox" id="checkbox230" checked="true" /><label for="checkbox230">Sidebar, with panels for basic style settings, node style settings,</label>
<li><input type="checkbox" id="checkbox104" checked="true" /><label for="checkbox104">Sidebar, with panels for basic style settings, node style settings,</label>
outline, theme selection, and structure selection</li>
<li><input type="checkbox" id="checkbox231" checked="true" /><label for="checkbox231">Import and export functionality; data is saved in the browser's local</label>
<li><input type="checkbox" id="checkbox105" checked="true" /><label for="checkbox105">Import and export functionality; data is saved in the browser's local</label>
storage by default, but it also supports creating, opening, and editing
local files on the computer directly</li>
<li><input type="checkbox" id="checkbox232" checked="true" /><label for="checkbox232">Right-click menu, which supports operations such as expanding, collapsing,</label>
<li><input type="checkbox" id="checkbox106" checked="true" /><label for="checkbox106">Right-click menu, which supports operations such as expanding, collapsing,</label>
and organizing layout</li>
<li><input type="checkbox" id="checkbox233" checked="true" /><label for="checkbox233">Bottom bar, which supports node and word count statistics, switching</label>
<li><input type="checkbox" id="checkbox107" checked="true" /><label for="checkbox107">Bottom bar, which supports node and word count statistics, switching</label>
between edit and read-only modes, zooming in and out, and switching to
full screen, support mini map</li>
</ul>

1
web/src/pages/Doc/en/start/index.md
View File

@@ -91,6 +91,7 @@ If you only use library, you don't need to read this section.
```bash
git clone https://github.com/wanglin2/mind-map.git
cd mind-map
cd simple-mind-map
npm i
npm link

1
web/src/pages/Doc/en/start/index.vue
View File

@@ -64,6 +64,7 @@ compile this dependency:</p>
<p>If you only use library, you don't need to read this section.</p>
<h3>Local Development</h3>
<pre class="hljs"><code>git <span class="hljs-built_in">clone</span> https://github.com/wanglin2/mind-map.git
<span class="hljs-built_in">cd</span> mind-map
<span class="hljs-built_in">cd</span> simple-mind-map
npm i
npm link

3
web/src/pages/Doc/routerList.js
View File

@@ -43,7 +43,8 @@ export default [
{ path: 'view', title: 'View实例' },
{ path: 'watermark', title: 'Watermark插件' },
{ path: 'xmind', title: 'XMind解析' },
{ path: 'deploy', title: '部署' }
{ path: 'deploy', title: '部署' },
{ path: 'client', title: '客户端' }
]
},
{

80
web/src/pages/Doc/zh/client/index.md Normal file
View File

@@ -0,0 +1,80 @@
# 客户端
本项目也提供了客户端版本，使用[Electron](https://www.electronjs.org/)开发。支持`Windows`、`Mac`及`Linux`。
目前功能比较简单：
1.支持新建、打开文件进行编辑；
2.支持查看最近编辑文件列表；
3.支持文件的复制、删除、重命名；
## 下载
你可以直接下载对应的客户端安装使用，提供了两个下载地址：
Github：[releases](https://github.com/wanglin2/mind-map/releases)。
百度云盘：[地址](https://pan.baidu.com/s/1huasEbKsGNH2Af68dvWiOg?pwd=3bp3)。
## 开发
如果有需要，你也可以进行二次开发。
### clone
```bash
git clone https://github.com/wanglin2/mind-map.git
cd mind-map
git checkout electron
```
### 启动服务
在项目根目录下执行：
```bash
cd simple-mind-map
npm i
npm link
cd ..
cd web
npm i
npm link simple-mind-map
npm run electron:serve
```
### 打包客户端
你至少需要两台电脑，一台`Windows`和一台`Mac`。
打包`Windows`应用：
```bash
npm run electron:build-win
```
打包`Mac`应用：
```bash
npm run electron:build-mac
```
打包`Linux`应用：
```bash
npm run electron:build-linux
```
打包全部应用：
```bash
npm run electron:build-all
```
根据你的电脑系统自动打包：
```bash
npm run electron:build
```

60
web/src/pages/Doc/zh/client/index.vue Normal file
View File

@@ -0,0 +1,60 @@
<template>
<div>
<h1>客户端</h1>
<p>本项目也提供了客户端版本，使用<a href="https://www.electronjs.org/">Electron</a>开发。支持<code>Windows</code>、<code>Mac</code>及<code>Linux</code>。</p>
<p>目前功能比较简单：</p>
<p>1.支持新建、打开文件进行编辑；</p>
<p>2.支持查看最近编辑文件列表；</p>
<p>3.支持文件的复制、删除、重命名；</p>
<h2>下载</h2>
<p>你可以直接下载对应的客户端安装使用，提供了两个下载地址：</p>
<p>Github：<a href="https://github.com/wanglin2/mind-map/releases">releases</a>。</p>
<p>百度云盘：<a href="https://pan.baidu.com/s/1huasEbKsGNH2Af68dvWiOg?pwd=3bp3">地址</a>。</p>
<h2>开发</h2>
<p>如果有需要，你也可以进行二次开发。</p>
<h3>clone</h3>
<pre class="hljs"><code>git <span class="hljs-built_in">clone</span> https://github.com/wanglin2/mind-map.git
<span class="hljs-built_in">cd</span> mind-map
git checkout electron
</code></pre>
<h3>启动服务</h3>
<p>在项目根目录下执行：</p>
<pre class="hljs"><code><span class="hljs-built_in">cd</span> simple-mind-map
npm i
npm link
<span class="hljs-built_in">cd</span> ..
<span class="hljs-built_in">cd</span> web
npm i
npm link simple-mind-map
npm run electron:serve
</code></pre>
<h3>打包客户端</h3>
<p>你至少需要两台电脑，一台<code>Windows</code>和一台<code>Mac</code>。</p>
<p>打包<code>Windows</code>应用：</p>
<pre class="hljs"><code>npm run electron:build-win
</code></pre>
<p>打包<code>Mac</code>应用：</p>
<pre class="hljs"><code>npm run electron:build-mac
</code></pre>
<p>打包<code>Linux</code>应用：</p>
<pre class="hljs"><code>npm run electron:build-linux
</code></pre>
<p>打包全部应用：</p>
<pre class="hljs"><code>npm run electron:build-all
</code></pre>
<p>根据你的电脑系统自动打包：</p>
<pre class="hljs"><code>npm run electron:build
</code></pre>
</div>
</template>
<script>
export default {
}
</script>
<style>
</style>

2
web/src/pages/Doc/zh/introduction/index.md
View File

@@ -3,6 +3,8 @@
`simple-mind-map`是一个简单&强大的Web思维导图库，不依赖任何特定框架。可以帮助你快速开发思维导图产品。
> 如果你只是想使用思维导图，你也完全可以把本项目的demo作为一个普通的在线思维导图工具使用。点击右上角的【在线示例】开始使用吧。
>
> 另外也提供了客户端可供下载，支持`Windows`、`Mac`及`Linux`，[点此了解更多](/mind-map/#/doc/zh/client)。
## 特性

37
web/src/pages/Doc/zh/introduction/index.vue
View File

@@ -4,22 +4,23 @@
<p><code>simple-mind-map</code>是一个简单&amp;强大的Web思维导图库，不依赖任何特定框架。可以帮助你快速开发思维导图产品。</p>
<blockquote>
<p>如果你只是想使用思维导图，你也完全可以把本项目的demo作为一个普通的在线思维导图工具使用。点击右上角的【在线示例】开始使用吧。</p>
<p>另外也提供了客户端可供下载，支持<code>Windows</code>、<code>Mac</code>及<code>Linux</code>，<a href="/mind-map/#/doc/zh/client">点此了解更多</a>。</p>
</blockquote>
<h2>特性</h2>
<ul>
<li><input type="checkbox" id="checkbox180" checked="true" /><label for="checkbox180">插件化架构，除核心功能外，其他功能作为插件提供，按需使用，减小整体体积</label></li>
<li><input type="checkbox" id="checkbox181" checked="true" /><label for="checkbox181">支持逻辑结构图、思维导图、组织结构图、目录组织图、时间轴、鱼骨图六种结构</label></li>
<li><input type="checkbox" id="checkbox182" checked="true" /><label for="checkbox182">内置多种主题，允许高度自定义样式，支持注册新主题</label></li>
<li><input type="checkbox" id="checkbox183" checked="true" /><label for="checkbox183">支持快捷键</label></li>
<li><input type="checkbox" id="checkbox184" checked="true" /><label for="checkbox184">节点内容支持图片、图标、超链接、备注、标签、概要</label></li>
<li><input type="checkbox" id="checkbox185" checked="true" /><label for="checkbox185">支持前进后退</label></li>
<li><input type="checkbox" id="checkbox186" checked="true" /><label for="checkbox186">支持拖动、缩放</label></li>
<li><input type="checkbox" id="checkbox187" checked="true" /><label for="checkbox187">支持右键和Ctrl+左键两种多选方式</label></li>
<li><input type="checkbox" id="checkbox188" checked="true" /><label for="checkbox188">支持节点自由拖拽、拖拽调整</label></li>
<li><input type="checkbox" id="checkbox189" checked="true" /><label for="checkbox189">支持多种节点形状</label></li>
<li><input type="checkbox" id="checkbox190" checked="true" /><label for="checkbox190">支持导出为</label><code>json</code>、<code>png</code>、<code>svg</code>、<code>pdf</code>、<code>markdown</code>，支持从<code>json</code>、<code>xmind</code>、<code>markdown</code>导入</li>
<li><input type="checkbox" id="checkbox191" checked="true" /><label for="checkbox191">支持小地图、支持水印</label></li>
<li><input type="checkbox" id="checkbox192" checked="true" /><label for="checkbox192">支持关联线</label></li>
<li><input type="checkbox" id="checkbox72" checked="true" /><label for="checkbox72">插件化架构，除核心功能外，其他功能作为插件提供，按需使用，减小整体体积</label></li>
<li><input type="checkbox" id="checkbox73" checked="true" /><label for="checkbox73">支持逻辑结构图、思维导图、组织结构图、目录组织图、时间轴、鱼骨图六种结构</label></li>
<li><input type="checkbox" id="checkbox74" checked="true" /><label for="checkbox74">内置多种主题，允许高度自定义样式，支持注册新主题</label></li>
<li><input type="checkbox" id="checkbox75" checked="true" /><label for="checkbox75">支持快捷键</label></li>
<li><input type="checkbox" id="checkbox76" checked="true" /><label for="checkbox76">节点内容支持图片、图标、超链接、备注、标签、概要</label></li>
<li><input type="checkbox" id="checkbox77" checked="true" /><label for="checkbox77">支持前进后退</label></li>
<li><input type="checkbox" id="checkbox78" checked="true" /><label for="checkbox78">支持拖动、缩放</label></li>
<li><input type="checkbox" id="checkbox79" checked="true" /><label for="checkbox79">支持右键和Ctrl+左键两种多选方式</label></li>
<li><input type="checkbox" id="checkbox80" checked="true" /><label for="checkbox80">支持节点自由拖拽、拖拽调整</label></li>
<li><input type="checkbox" id="checkbox81" checked="true" /><label for="checkbox81">支持多种节点形状</label></li>
<li><input type="checkbox" id="checkbox82" checked="true" /><label for="checkbox82">支持导出为</label><code>json</code>、<code>png</code>、<code>svg</code>、<code>pdf</code>、<code>markdown</code>，支持从<code>json</code>、<code>xmind</code>、<code>markdown</code>导入</li>
<li><input type="checkbox" id="checkbox83" checked="true" /><label for="checkbox83">支持小地图、支持水印</label></li>
<li><input type="checkbox" id="checkbox84" checked="true" /><label for="checkbox84">支持关联线</label></li>
</ul>
<h2>仓库目录介绍</h2>
<p>1.<code>simple-mind-map</code></p>
@@ -27,11 +28,11 @@
<p>2.<code>web</code></p>
<p>使用<code>simple-mind-map</code>库，基于<code>vue2.x</code>、<code>ElementUI</code>搭建的在线思维导图。特性：</p>
<ul>
<li><input type="checkbox" id="checkbox193" checked="true" /><label for="checkbox193">工具栏，支持插入节点、删除节点；编辑节点图片、图标、超链接、备注、标签、概要</label></li>
<li><input type="checkbox" id="checkbox194" checked="true" /><label for="checkbox194">侧边栏，基础样式设置面板、节点样式设置面板、大纲面板、主题选择面板、结构选择面板</label></li>
<li><input type="checkbox" id="checkbox195" checked="true" /><label for="checkbox195">导入导出功能；数据默认保存在浏览器本地存储，也支持直接创建、打开、编辑电脑本地文件</label></li>
<li><input type="checkbox" id="checkbox196" checked="true" /><label for="checkbox196">右键菜单，支持展开、收起、整理布局等操作</label></li>
<li><input type="checkbox" id="checkbox197" checked="true" /><label for="checkbox197">底部栏，支持节点数量、字数统计；支持切换编辑和只读模式；支持放大缩小；支持全屏切换；支持小地图</label></li>
<li><input type="checkbox" id="checkbox85" checked="true" /><label for="checkbox85">工具栏，支持插入节点、删除节点；编辑节点图片、图标、超链接、备注、标签、概要</label></li>
<li><input type="checkbox" id="checkbox86" checked="true" /><label for="checkbox86">侧边栏，基础样式设置面板、节点样式设置面板、大纲面板、主题选择面板、结构选择面板</label></li>
<li><input type="checkbox" id="checkbox87" checked="true" /><label for="checkbox87">导入导出功能；数据默认保存在浏览器本地存储，也支持直接创建、打开、编辑电脑本地文件</label></li>
<li><input type="checkbox" id="checkbox88" checked="true" /><label for="checkbox88">右键菜单，支持展开、收起、整理布局等操作</label></li>
<li><input type="checkbox" id="checkbox89" checked="true" /><label for="checkbox89">底部栏，支持节点数量、字数统计；支持切换编辑和只读模式；支持放大缩小；支持全屏切换；支持小地图</label></li>
</ul>
<p>提供文档页面服务。</p>
<p>3.<code>dist</code></p>

1
web/src/pages/Doc/zh/start/index.md
View File

@@ -86,6 +86,7 @@ const mindMap = new MindMap({
```bash
git clone https://github.com/wanglin2/mind-map.git
cd mind-map
cd simple-mind-map
npm i
npm link

1
web/src/pages/Doc/zh/start/index.vue
View File

@@ -58,6 +58,7 @@
<p>如果你只是使用库的话可以不用阅读此小节。</p>
<h3>本地开发</h3>
<pre class="hljs"><code>git <span class="hljs-built_in">clone</span> https://github.com/wanglin2/mind-map.git
<span class="hljs-built_in">cd</span> mind-map
<span class="hljs-built_in">cd</span> simple-mind-map
npm i
npm link