• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

玄子思维导图: 基于浏览器的Markdown语法图文结合的思维导图应用,是居家旅行游记、编 ...

原作者: [db:作者] 来自: 网络 收藏 邀请

玄子思维导图

玄子思维导图

应用简介

国产开源开箱即用的在线思维导图笔记应用。

使用方法

主要特性

  • 支持在Markdown中嵌入思维导图;
  • 支持通过文本方便修改思维导图内容;
  • 支持离线和在线管理本机的脑图文档;
  • 支持主流浏览器开箱即用随时随地编写脑图和文档,无需安装下载;
  • 编写的文档可以通过选择-复制,然后粘贴到微信公众号等编辑器中使用;
  • 支持“标准”Markdown / CommonMark和Github风格的语法,也可变身为代码编辑器;
  • 支持实时预览、图片(跨域)上传、预格式文本/代码/表格插入、代码折叠、搜索替换、只读模式、自定义样式主题和多语言语法高亮等功能;
  • 支持ToC(Table of Contents)、Emoji表情、Task lists、@链接等Markdown扩展语法;
  • 支持TeX科学公式(基于KaTeX)、流程图 Flowchart 和 时序图 Sequence Diagram;

v0.2 新特性

  • 支持通过文本设置脑图节点的字体大小;
  • 支持通过文本设置脑图节点字体颜色和背景颜色
  • 支持渲染指定文本为二维码;

v0.7 新特性

  • 添加作为编辑器独立使用的接口

第三方开发接口

  • 使用说明在js上下文中配置 window.XZMindEditorConfig 参数即可独立使用MD脑图编辑器,无需通过文件管理创建文件。可以添加文件保存时的事件,来接收编辑器保存的正文内容。
  • JavaScript接口样例
			var editorConfig = {				title:"title",  	 			path:"/test/path",	//显示地址  	 			markdown:"编辑器显示文本",		//编辑器显示文本  	 			onSave:function(markdown){  	 				//用户点击保存按钮执行的方法  	 				console.log('save markdown '+markdown);  	 			}  	 	};   	 	window.XZMindEditorConfig = editorConfig;
  • 接口例子在项目的wars文件夹下,打开index-editor.html即可查看样例,点击打开 独立编辑样例

使用技巧

设置节点颜色演示

	```mind	思维导图字体颜色演示		 . 说话的艺术			#FF00ff 1.警告的话			#44ff00 2. 温馨的话			#229933 3. 关怀的话			#ff3300 4. 强硬的话		. 背景颜色			##ff00ff 高兴的事情			##ff9900 不开心的事			##00ff88 悠闲的时光		第三项 : 样例节点	``` 

渲染效果

sample-1

设置节点字体大小

	```mind	思维导图字体演示		 ## 重要事项			# 1.特别重要事项			## 2. 也很重要的事			### 3. 需要注意的事情			#### 4. 留意的事情		第二项 : 样例节点		第三项 : 样例节点	``` 

渲染效果sample-1

嵌入二维码

	```qrcode	二维码码内容,链接 https://xuanzi.ltd	```

嵌入思维导图1

     ```mind        :逻辑图        样例 : 在MD文档中插入思维导图        	第一项 : 样例节点        		子节点        		子节点        	第二项 : 样例节点        	第三项 : 样例节点     ```

说明:用TAB键划分节点层次

** 渲染的显示效果 **

sample-1

嵌入思维导图2

说明:用TAB键划分节点层次

     ```mind        :树杈图        百科词条:中华人民共和国        	首都:北京        		故宫        		天安门        		鸟巢        	面积:960万平方公里        		陆地面积960万平方公里        		领海约470万平方公里        	主要城市        		天津        		江城:武汉        		成都        		花城:广州        	主要节日:春节\n元宵节\n清明节\n端午节\n中秋节        	---文化思想        		诸子百家        		汉服文化        		唐诗宋词     ```

** 渲染的显示效果 **

sample-2

常用技巧

  • 支持MD语法输入,例如以下示例创建一幅简单的思维导图:
   ```mind       :逻辑图       样例 : 在MD文档中插入思维导图       	第一项 : 样例节点       		子节点       		子节点       	第二项 : 样例节点       	第三项 : 样例节点   ````
  • 思维导图每一个节点已换行分隔,节点级别已TAB键符为层次划分,下级比上级多一个TAB键符。

内置浏览器的文件管理

  • 可以按分类创建文件夹和文件。
  • 所有文件存储在浏览器内部。

界面预览

  • 文件管理器

lightnight

  • 编辑器

sample-2

联系方式

主要使用到的开源项目

项目未来路线图

  • 支持更多思维导图结构布局
  • 支持导入和导出文档
  • 支持多设备客户端,如PC、安卓、iphone、微信小程序等
  • 支持文件同步

项目编译方法

  • 这是基于GWT插件的项目,请先在eclipse中安装GWT开发插件。
  • 下载本项目的源代码,并导入eclipse项目即可。
  • 编译思维导图渲染和文件管理模块等源码请在以下项目中下载,编译方法同上:
  • XZMindMap
  • IndexedFSView
  • IndexeddbFS
  • Indexeddb_gwt

鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
view-office: 使用jacob,poi来实现在线访问docx,xlsx,pptx的文件发布时间:2022-02-13
下一篇:
superapi-h5: 在线接口文档管理系统发布时间:2022-02-13
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap