diff --git a/src/js/src/bookmark/app.html b/src/js/src/bookmark/app.html index 7d524d1..2b6de96 100644 --- a/src/js/src/bookmark/app.html +++ b/src/js/src/bookmark/app.html @@ -22,7 +22,7 @@

グラフ画像部分

- +

diff --git a/src/js/src/bookmark/main.css b/src/js/src/bookmark/main.css index f3c6ce7..583a15b 100644 --- a/src/js/src/bookmark/main.css +++ b/src/js/src/bookmark/main.css @@ -61,6 +61,8 @@ height: 60vh; overflow-x: scroll; overflow-y: scroll; + min-height: 480px; + min-width: 640px; } #mainView p { diff --git a/src/js/src/bookmark/main.js b/src/js/src/bookmark/main.js index 2f7c1bd..099e205 100644 --- a/src/js/src/bookmark/main.js +++ b/src/js/src/bookmark/main.js @@ -13,9 +13,11 @@ const dotViewer = document.querySelector("#dot-src-viewer"); const dot = dotViewer.value = card2dot(); const svg = await dot2svg(dot); - const dataUri = text2DataUriScheme(svg, mime); - document.querySelector("#ref-map").setAttribute("data", dataUri); + const parser = new DOMParser(); + const doc = parser.parseFromString(svg, "application/xml"); + document.querySelector("#ref-map").innerHTML = doc.documentElement.innerHTML + } catch (err) { console.log(err); } @@ -92,8 +94,18 @@ dot2svg(document.querySelector("#dot-src-viewer").value) .then(xml => { const canvas = document.querySelector("#ref-map"); - const data = text2DataUriScheme(xml, "image/svg+xml"); - canvas.setAttribute("data", data); + + const parser = new DOMParser(); + const doc = parser.parseFromString(xml, "application/xml"); + + const svgAttr = doc.documentElement.attributes; + for(const attr of svgAttr) { + canvas.setAttribute(attr.name, attr.value); + } + canvas.setAttribute("overflow", "scroll") + + canvas.innerHTML = doc.documentElement.innerHTML + }).catch(err => { console.log(err) });