一、功能简介
kityminder是一款用于制作思维导图的在线工具，主要功能包括：画线、改颜色、缩放、编辑、多样式选择、本地导入、导出等。
在绘制思维导图时，我们只需要选择需要的节点，然后可以通过拖动、双击、右键菜单等方式对节点进行编辑和排版，具体的操作十分简单直观。
在进行节点编辑后，进一步可以加入图标和图片，特别是对于生产工具类的思维导图，比如需求分析、软件设计等方面，我们可以通过在图标上自定义文字，来辅助描述和传递信息。
二、布局及编辑
在kityminder中，最大的创新和特色，就是对于思维导图的节点可以支持多种布局方式。
我们可以将节点布置在上下、左右、环形等多种布局方式中自由组合，使得思维导图的表现形式更加多样化。
同时，在节点数量较多时，我们可以通过缩放、改变节点大小、颜色等方式，进一步将节点分组，让整个思维导图看起来更加清晰。
下面是一个头脑风暴的示例，可以通过修改颜色、大小等方式，让关键点更加突出
minder.ImportJson({ "root": { "data": { "id": "123", "text": "主题" }, "children": [ { "data": { "id": "123_1", "text": "相关因素" }, "children": [ { "data": { "id": "123_1_1", "text": "因素1", "background-color": "#E3F2FD", "text-color": "#0082c8", "font-size": "20", "width": "205" } }, { "data": { "id": "123_1_2", "text": "因素2", "background-color": "#B3E5FC", "text-color": "#005daa", "fold-status": "expand", "font-size": "20", "width": "220" } }, { "data": { "id": "123_1_3", "text": "因素3", "background-color": "#81D4FA", "text-color": "#ffffff", "font-size": "36", "width": "200" } } ], "background-color": "#4DA1FF", "text-color": "#ffffff", "font-size": "24", "width": "240" }, { "data": { "id": "123_2", "text": "正面影响" }, "children": [ { "data": { "id": "123_2_1", "text": "影响1", "background-color": "#E3F2FD", "text-color": "#0082c8", "font-size": "20", "width": "205" } }, { "data": { "id": "123_2_2", "text": "影响2", "background-color": "#B3E5FC", "text-color": "#005daa", "fold-status": "expand", "font-size": "20", "width": "220" } }, { "data": { "id": "123_2_3", "text": "影响3", "background-color": "#81D4FA", "text-color": "#ffffff", "font-size": "36", "width": "200" } } ], "background-color": "#4DA1FF", "text-color": "#ffffff", "font-size": "24", "width": "240" }, { "data": { "id": "123_3", "text": "负面影响" }, "children": [ { "data": { "id": "123_3_1", "text": "影响1", "background-color": "#FFCDD2", "text-color": "#d50000", "font-size": "20", "width": "205" } }, { "data": { "id": "123_3_2", "text": "影响2", "background-color": "#FFA5A5", "text-color": "#d50000", "fold-status": "expand", "font-size": "20", "width": "220" } }, { "data": { "id": "123_3_3", "text": "影响3", "background-color": "#F44336", "text-color": "#ffffff", "font-size": "36", "width": "200" } } ], "background-color": "#FF5252", "text-color": "#ffffff", "font-size": "24", "width": "240" } ] } });
三、多平台支持
kityminder是跨平台使用的，不论是Windows、MacOS或者Linux，都可以通过在线访问的方式来使用本工具。
同时，我们可以将思维导图导出为多种格式，例如SVG、PNG、HTML、PDF等，让我们进一步方便地将思维导图整合到我们的工作与生活中来。
四、代码示例
下面是一个简单的示例代码，可以用来绘制一棵简单的思维导图：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>kityminder 示例</title>
<script type="text/javascript" src="http://cdn.kityminder.com/zh_cn/latest/kityminder.core.min.js"></script>
</head>
<body>
<div id="kitymind" style="width:800px;height:500px;margin:0 auto;"></div>
<script type="text/javascript">
window.onload = function() {
var km = new kityminder.Minder({
renderTo: 'kitymind',
theme: 'fresh-blue'
});
var rootNode = km.createNode('根节点'),
childNode1 = km.createNode('节点1'),
childNode2 = km.createNode('节点2');
rootNode.appendChild(childNode1);
childNode1.appendChild(childNode2);
km.getRoot().appendChild(rootNode);
};
</script>
</body>
</html>
