Dan/proxmox-helper-script
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update mermaidjs.html

Browse Source
This commit is contained in:
Dan 2026-04-17 23:15:19 +08:00
parent 9b4f6824f2
commit 316b96259a
1 changed files with 69 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
mermaidjs.html
View File

@ -61,6 +61,70 @@
} }
}); });
// Export functions
window.exportSyntax = function() {
const code = editor.value.trim();
if (!code) {
alert('Diagram is empty');
return;
}
const blob = new Blob([code], { type: 'text/plain' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = 'diagram.mmd';
a.click();
URL.revokeObjectURL(url);
};
window.exportSVG = function() {
const svg = document.querySelector('#preview svg');
if (!svg) {
alert('Render diagram first');
return;
}
const svgData = new XMLSerializer().serializeToString(svg);
const blob = new Blob([svgData], { type: 'image/svg+xml' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = 'diagram.svg';
a.click();
URL.revokeObjectURL(url);
};
window.exportPNG = function() {
const svg = document.querySelector('#preview svg');
if (!svg) {
alert('Render diagram first');
return;
}
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
const svgData = new XMLSerializer().serializeToString(svg);
const img = new Image();
img.onload = function() {
canvas.width = img.width;
canvas.height = img.height;
ctx.fillStyle = 'white';
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.drawImage(img, 0, 0);
canvas.toBlob(function(blob) {
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = 'diagram.png';
a.click();
URL.revokeObjectURL(url);
});
};
img.src = 'data:image/svg+xml;base64,' + btoa(svgData);
};
// Initial render // Initial render
editor.value = `graph TD editor.value = `graph TD
A[Start] --> B{Decision?} A[Start] --> B{Decision?}
@ -75,5 +139,10 @@
<body> <body>
<textarea spellcheck="false"></textarea> <textarea spellcheck="false"></textarea>
<div id="preview"></div> <div id="preview"></div>
<div style="position: fixed; bottom: 1rem; right: 1rem; display: flex; gap: 0.5rem;">
<button onclick="exportSyntax()" style="padding: 0.5rem 1rem; background: #4CAF50; color: white; border: none; border-radius: 4px; cursor: pointer;">📥 .mmd</button>
<button onclick="exportSVG()" style="padding: 0.5rem 1rem; background: #2196F3; color: white; border: none; border-radius: 4px; cursor: pointer;">📥 SVG</button>
<button onclick="exportPNG()" style="padding: 0.5rem 1rem; background: #FF9800; color: white; border: none; border-radius: 4px; cursor: pointer;">📥 PNG</button>
</div>
</body> </body>
</html> </html>