github地址:https://github.com/dundalek/markmap使用JavaScript生成思维导图(mindmap)。作者的readme很简单。今天有同事问作者如何运行作者提供的例子。这里我会写一个更详细的步骤出来。先看example.parse.js的内容:varfs=require('fs');varparse=require('../parse.markdown');vartransform=require('../transform.headings');vartext=fs.readFileSync('gtor.md','utf-8');varheadings=parse(text);varroot=transform(headings);console.log(root);fs.writeFileSync('gtor.json',JSON.stringify(root));使用nodejs命名节点example.parse.js执行这段代码:代码读取本地包含思维导图的文件gtor.md,解析并转换生成本地文件gtor.json。然后查看example.view.js,发现作者使用了d3进行UI渲染。d3.json("gtor.json",function(error,data){if(error)throwerror;markmap('svg#mindmap',data,{preset:'default',//orcolorfullinkShape:'diagonal'//或括号});});如果直接双击examples文件夹下的index.html文件在浏览器中打开,会出现跨域错误,无法访问本地文件gtor.json:这个例子必须部署到服务器上运行即可它。为了简单起见,我制作了一个简单的包装器。如果想运行例子看看效果,直接下载我的项目到本地:https://github.com/i042416/jerrylist本地直接用nodejs命令行启动服务器:nodelocal.js然后localhost:3000/mindmap可以看到思维导图的效果
