得以于 canvas 是 json 文件,借助 dataviewjs 将 canvas 的关系提取出来
感觉大家不怎么关注白板的关系整理，相关的插件也很少（只找到一个插件可以显示当前文件所出现的白板），是没有这方面需求吗？
列表样式
```dataviewjs
const targetCanvases = ["B.canvas","A.canvas"] //可以为空[],为空[]时搜索所有canvas
const labels = ["label1","label2"] ////可以为空[],为空[]时搜索所有label
const currentFile = dv.current(); //当前文件
// 依据文件名
let canvasFiles
if (targetCanvases.length === 0){
// 获取所有 Canvas 文件
canvasFiles = app.vault.getFiles().filter(file => file.extension === "canvas");
} else {
canvasFiles = app.vault.getFiles().filter(file => file.extension === "canvas" && targetCanvases.includes(file.name));
}
// 创建一个对象来存储分组结果
let groupedResults = {};
for (let file of canvasFiles) {
// 读取 Canvas 文件内容
const content = await app.vault.read(file);
// 解析 JSON 内容
const canvasData = JSON.parse(content);
// 查找文件名为当前文件的节点
const targetNode = canvasData.nodes.find(node =>
node.type === "file" && node.file === currentFile.file.link.path
);
if (targetNode) {
// 查找从目标节点出发的边,依据 labels 筛选
const connectedEdges = canvasData.edges.filter(edge =>
edge.fromNode === targetNode.id &&
(labels.length === 0 || (edge.label && labels.includes(edge.label)))
);
// 对于每个连接的边,查找目标节点并提取信息
connectedEdges.forEach(edge => {
const connectedNode = canvasData.nodes.find(node => node.id === edge.toNode);
if (connectedNode) {
const groupKey = `${file.name} - ${edge.label || 'No Label'}`;
if (!groupedResults[groupKey]) {
groupedResults[groupKey] = [];
}
if (connectedNode.type === "file") {
groupedResults[groupKey].push(connectedNode.file);
} else if (connectedNode.type === "text") {
groupedResults[groupKey].push(connectedNode.text);
}
}
});
}
}
// 显示分组结果
for (let groupKey in groupedResults) {
dv.header(3, groupKey);
dv.list(groupedResults[groupKey]);
}
```
callout样式,适合多行文本
```dataviewjs
const targetCanvases = ["B.canvas","A.canvas"] //指定canvas,为空时搜索所有canvas
const labels = ["label1","label2"] //可以为空[],为空时搜索所有label
const currentFile = dv.current();//当前文件
// 依据文件名
let canvasFiles
if (targetCanvases.length === 0){
// 获取所有 Canvas 文件
canvasFiles = app.vault.getFiles().filter(file => file.extension === "canvas");
} else {
canvasFiles = app.vault.getFiles().filter(file => file.extension === "canvas" && targetCanvases.includes(file.name));
}
// 创建一个对象来存储分组结果
let groupedResults = {};
for (let file of canvasFiles) {
// 读取 Canvas 文件内容
const content = await app.vault.read(file);
// 解析 JSON 内容
const canvasData = JSON.parse(content);
// 查找文件名为当前文件的节点
const targetNode = canvasData.nodes.find(node =>
node.type === "file" && node.file === currentFile.file.link.path
);
if (targetNode) {
// 查找从目标节点出发的边,依据 labels 筛选
const connectedEdges = canvasData.edges.filter(edge =>
edge.fromNode === targetNode.id &&
(labels.length === 0 || (edge.label && labels.includes(edge.label)))
);
// 对于每个连接的边,查找目标节点并提取信息
connectedEdges.forEach(edge => {
const connectedNode = canvasData.nodes.find(node => node.id === edge.toNode);
if (connectedNode) {
const groupKey = `${file.name} - ${edge.label || 'No Label'}`;
if (!groupedResults[groupKey]) {
groupedResults[groupKey] = [];
}
if (connectedNode.type === "file") {
groupedResults[groupKey].push(connectedNode.file);
} else if (connectedNode.type === "text") {
groupedResults[groupKey].push(connectedNode.text);
}
}
});
}
}
// 显示分组结果
for (let groupKey in groupedResults) {
dv.header(3, groupKey);
const container = dv.el("div", "", {cls: "callout"});
groupedResults[groupKey].forEach((item, index) => {
container.appendChild(dv.el("div", item, {cls: "callout"}));
// 如果不是最后一个元素,添加一个换行
if (index < groupedResults[groupKey].length - 1) {
container.appendChild(dv.el("br"));
}
});
}
```
