purgatory/Xray-docs-next
1
0
Fork 0
mirror of https://github.com/XTLS/Xray-docs-next.git synced 2025-04-03 05:13:35 +03:00
Code Issues Projects Releases Packages Wiki Activity

fix: mermaid chart rendering (again)

Browse source
This commit is contained in:
hmol233 2021-09-12 20:39:48 +08:00
parent fb0deffb7e
commit d98294791b
No known key found for this signature in database
GPG key ID: D617A9DAB0C992D5
2 changed files with 5 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
docs/.vuepress/theme/components/Mermaid.vue
View file

@ -25,7 +25,6 @@ export default defineComponent({
const html = reactive({ innerHtml: "" }); const html = reactive({ innerHtml: "" });
onMounted(() => { onMounted(() => {
nextTick(async function () { nextTick(async function () {
console.log(chartID, rawGraph);
const mermaid = await import("mermaid"); const mermaid = await import("mermaid");
mermaid.default.initialize({ mermaid.default.initialize({
startOnLoad: false, startOnLoad: false,
@ -33,7 +32,7 @@ export default defineComponent({
}); });
mermaid.default.render( mermaid.default.render(
chartID.value, chartID.value,
rawGraph.value, decodeURI(rawGraph.value),
(svgCode, bindFunc) => { (svgCode, bindFunc) => {
html.innerHtml = svgCode; html.innerHtml = svgCode;
} }
@ -49,7 +48,7 @@ export default defineComponent({
}); });
mermaid.default.render( mermaid.default.render(
chartID.value, chartID.value,
rawGraph.value, decodeURI(rawGraph.value),
(svgCode, bindFunc) => { (svgCode, bindFunc) => {
html.innerHtml = svgCode; html.innerHtml = svgCode;
} }

8
docs/.vuepress/theme/plugin/mermaidPlugin.ts
View file

@ -12,11 +12,9 @@ const MermaidPlugin: PluginSimple = function (md) {
const token = tokens[idx]; const token = tokens[idx];
const key = `mermaid_${hash(idx)}`; const key = `mermaid_${hash(idx)}`;
let { content } = token; let { content } = token;
content = content.replaceAll(";\n", ";"); return `<Mermaid identifier="${key}" graph="${encodeURI(
content = content.replaceAll("\n\n", ";"); content
content = content.replaceAll("\n", ";"); )}"></Mermaid>`;
content = content.replaceAll('"', "'");
return `<Mermaid identifier="${key}" graph="${content}"></Mermaid>`;
} }
const rawCode = fence(...args); const rawCode = fence(...args);
return `${rawCode}`; return `${rawCode}`;