fix: png was cut off when bleed > 0

This commit is contained in:
s3lph 2024-01-25 23:06:52 +01:00
parent 5672860649
commit c87bd85fde

View file

@ -221,27 +221,33 @@
a.click();
};
inputButtonDownloadPng.onclick = (ev) => {
let svgSize = doc.width.baseVal.value;
let svgOffset = doc.viewBox.baseVal.x;
let imgSize = parseInt(prompt("Enter image size (e.g. 2048)", "2048"));
let svgRoot = doc.getElementById("svgroot");
if (Number.isNaN(imgSize)) {
return;
}
// Resize SVG to output size, then export as XML, and resize back to default size
doc.getElementById("bleed").style.stroke = 'black';
doc.width.baseVal.value = imgSize;
doc.height.baseVal.value = imgSize;
doc.viewBox.baseVal.width = imgSize;
doc.viewBox.baseVal.height = imgSize;
svgRoot.transform.baseVal[0].matrix.a = imgSize/500;
svgRoot.transform.baseVal[0].matrix.d = imgSize/500;
doc.viewBox.baseVal.x = svgOffset * imgSize/svgSize;
doc.viewBox.baseVal.y = svgOffset * imgSize/svgSize;
svgRoot.transform.baseVal[0].matrix.a = imgSize/svgSize;
svgRoot.transform.baseVal[0].matrix.d = imgSize/svgSize;
let serialized = new XMLSerializer().serializeToString(doc);
doc.getElementById("bleed").style.stroke = '#ff00ff';
svgRoot.transform.baseVal[0].matrix.a = 1;
svgRoot.transform.baseVal[0].matrix.d = 1;
doc.viewBox.baseVal.width = 500;
doc.viewBox.baseVal.height = 500;
doc.width.baseVal.value = 500;
doc.height.baseVal.value = 500;
doc.viewBox.baseVal.width = svgSize;
doc.viewBox.baseVal.height = svgSize;
doc.viewBox.baseVal.x = svgOffset;
doc.viewBox.baseVal.y = svgOffset;
doc.width.baseVal.value = svgSize;
doc.height.baseVal.value = svgSize;
let canvas = document.createElement('canvas');
canvas.width = imgSize;