diff --git a/src/assets/utils.ts b/src/assets/utils.ts
index fb8d8b4..cfcb671 100644
--- a/src/assets/utils.ts
+++ b/src/assets/utils.ts
@@ -28,8 +28,10 @@ export function downloadSVGasPNG(filename: string, svgSelector: string): void {
return;
}
- const svgData = new XMLSerializer().serializeToString(svgElem);
- // svgData = '\r\n' + svgData;
+ let svgData = new XMLSerializer().serializeToString(svgElem);
+ svgData = '\r\n' + svgData;
+ svgData = insertStyleSheets(svgData);
+ // downloadText(filename.replace("png", "svg"), svgData);
const svgBlob = new Blob([svgData], { type: "image/svg+xml;charset=utf-8" });
const DOMURL = window.URL || window.webkitURL || window;
@@ -39,7 +41,7 @@ export function downloadSVGasPNG(filename: string, svgSelector: string): void {
img.onload = () => {
const canvas = document.createElement("canvas");
const ctx = canvas.getContext("2d");
- const domRect = (svgElem as SVGGraphicsElement).getBBox();
+ const domRect = svgElem.getBoundingClientRect();
canvas.width = domRect.width;
canvas.height = domRect.height;
ctx?.drawImage(img, 0, 0, domRect.width, domRect.height);
@@ -58,4 +60,27 @@ export function downloadSVGasPNG(filename: string, svgSelector: string): void {
img.src = svgUrl;
}
+function insertStyleSheets(svgData: string): string {
+ // based on https://stackoverflow.com/a/41346127/1140589
+ let styleStr = "";
+
+ // svgData.
+ return svgData.replace(/]*)>/, "" + styleStr);
+}
+
export const SYMBOL_DECEASED = "+"; // "💀";
diff --git a/src/components/NetworkMap.vue b/src/components/NetworkMap.vue
index 7257ce5..49b1ca1 100644
--- a/src/components/NetworkMap.vue
+++ b/src/components/NetworkMap.vue
@@ -341,7 +341,10 @@ export default defineComponent({