修复xmind8版本文件导入失败的问题

This commit is contained in:
wanglin2 2022-09-23 16:16:08 +08:00
parent 13c4b51f69
commit 5a5062ecaf
4 changed files with 113 additions and 7 deletions

View File

@ -90,7 +90,7 @@ npm run build
# 安装
> 当然仓库版本0.2.7当前npm版本0.2.7
> 当然仓库版本0.2.8当前npm版本0.2.7
```bash
npm i simple-mind-map
@ -151,6 +151,14 @@ console.log(MindMap.xmind)
`content``.xmind`压缩包内的`content.json`文件内容
#### transformOldXmind(content)
v0.2.8+
针对`xmind8`版本的数据解析,因为该版本的`.xmind`文件内没有`content.json`,对应的是`content.xml`。
`content``.xmind`压缩包内的`content.xml`文件内容
### 实例化选项:
| 字段名称 | 类型 | 默认值 | 描述 | 是否必填 |

View File

@ -1 +1 @@
<!DOCTYPE html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><title>一个简单的web思维导图实现</title><link href="dist/js/chunk-2d20ec02.81d632f4.js" rel="prefetch"><link href="dist/js/chunk-2d216b67.228f2009.js" rel="prefetch"><link href="dist/js/chunk-35b0a040.cb76da7d.js" rel="prefetch"><link href="dist/css/app.9be46b7b.css" rel="preload" as="style"><link href="dist/css/chunk-vendors.6fd71983.css" rel="preload" as="style"><link href="dist/js/app.0fd74a8c.js" rel="preload" as="script"><link href="dist/js/chunk-vendors.e2fb5b67.js" rel="preload" as="script"><link href="dist/css/chunk-vendors.6fd71983.css" rel="stylesheet"><link href="dist/css/app.9be46b7b.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but thoughts doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="dist/js/chunk-vendors.e2fb5b67.js"></script><script src="dist/js/app.0fd74a8c.js"></script></body></html>
<!DOCTYPE html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><title>一个简单的web思维导图实现</title><link href="dist/js/chunk-2d20ec02.81d632f4.js" rel="prefetch"><link href="dist/js/chunk-2d216b67.228f2009.js" rel="prefetch"><link href="dist/js/chunk-35b0a040.cb76da7d.js" rel="prefetch"><link href="dist/css/app.9be46b7b.css" rel="preload" as="style"><link href="dist/css/chunk-vendors.6fd71983.css" rel="preload" as="style"><link href="dist/js/app.91233d74.js" rel="preload" as="script"><link href="dist/js/chunk-vendors.e4b722f1.js" rel="preload" as="script"><link href="dist/css/chunk-vendors.6fd71983.css" rel="stylesheet"><link href="dist/css/app.9be46b7b.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but thoughts doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="dist/js/chunk-vendors.e4b722f1.js"></script><script src="dist/js/app.91233d74.js"></script></body></html>

View File

@ -1,6 +1,6 @@
{
"name": "simple-mind-map",
"version": "0.2.7",
"version": "0.2.8",
"description": "一个简单的web在线思维导图",
"authors": [
{
@ -26,7 +26,8 @@
"deepmerge": "^1.5.2",
"eventemitter3": "^4.0.7",
"jspdf": "^2.5.1",
"jszip": "^3.10.1"
"jszip": "^3.10.1",
"xml-js": "^1.6.11"
},
"keywords": [
"javascript",

View File

@ -1,4 +1,5 @@
import JSZip from "jszip";
import xmlConvert from "xml-js";
/**
* javascript comment
@ -11,9 +12,20 @@ const parseXmindFile = (file) => {
JSZip.loadAsync(file).then(
async (zip) => {
try {
let content = await zip.files["content.json"].async("string");
let res = transformXmind(content);
resolve(res);
let content = "";
if (zip.files["content.json"]) {
let json = await zip.files["content.json"].async("string");
content = transformXmind(json);
} else if (zip.files["content.xml"]) {
let xml = await zip.files["content.xml"].async("string");
let json = xmlConvert.xml2json(xml);
content = transformOldXmind(json);
}
if (content) {
resolve(content);
} else {
reject(new Error("解析失败"));
}
} catch (error) {
reject(error);
}
@ -70,7 +82,92 @@ const transformXmind = (content) => {
return newTree;
};
/**
* javascript comment
* @Author: 王林25
* @Date: 2022-09-23 15:51:51
* @Desc: 转换旧版xmind数据xmind8
*/
const transformOldXmind = (content) => {
let data = JSON.parse(content);
let elements = data.elements;
let root = null;
let getRoot = (arr) => {
for (let i = 0; i < arr.length; i++) {
if (!root && arr[i].name === "topic") {
root = arr[i];
return;
}
}
arr.forEach((item) => {
getRoot(item.elements);
});
};
getRoot(elements);
let newTree = {};
let getItemByName = (arr, name) => {
return arr.find((item) => {
return item.name === name;
});
};
let walk = (node, newNode) => {
let nodeElements = node.elements;
newNode.data = {
// 节点内容
text: getItemByName(nodeElements, "title").elements[0].text,
};
try {
// 节点备注
let notesElement = getItemByName(nodeElements, "notes");
if (notesElement) {
newNode.data.note =
notesElement.elements[0].elements[0].elements[0].text;
}
} catch (error) {}
try {
// 超链接
if (
node.attributes &&
node.attributes["xlink:href"] &&
/^https?:\/\//.test(node.attributes["xlink:href"])
) {
newNode.data.hyperlink = node.attributes["xlink:href"];
}
} catch (error) {}
try {
// 标签
let labelsElement = getItemByName(nodeElements, "labels");
if (labelsElement) {
newNode.data.tag = labelsElement.elements.map((item) => {
return item.elements[0].text;
});
}
} catch (error) {}
// 子节点
newNode.children = [];
let _children = getItemByName(nodeElements, "children");
if (_children && _children.elements && _children.elements.length > 0) {
_children.elements.forEach((item) => {
if (item.name === "topics") {
item.elements.forEach((item2) => {
let newChild = {};
newNode.children.push(newChild);
walk(item2, newChild);
});
} else {
let newChild = {};
newNode.children.push(newChild);
walk(item, newChild);
}
});
}
};
walk(root, newTree);
return newTree;
};
export default {
parseXmindFile,
transformXmind,
transformOldXmind,
};