backups/Fantasy-Map-Generator
1
0
Fork 0
mirror of https://github.com/Azgaar/Fantasy-Map-Generator.git synced 2025-12-17 01:41:22 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: move scaleBar to the corner of svg export

Browse source
This commit is contained in:
Azgaar 2023-11-19 20:10:42 +04:00
parent 20b09e8634
commit 433152db06
9 changed files with 153 additions and 156 deletions
Download patch file Download diff file Expand all files Collapse all files

48
modules/io/export.js
View file

@ -1,27 +1,21 @@
"use strict";
// Functions to export map to image or data files
// download map as SVG
async function saveSVG() {
TIME && console.time("saveSVG");
async function exportToSvg() {
TIME && console.time("exportToSvg");
const url = await getMapURL("svg", {fullMap: true});
const link = document.createElement("a");
link.download = getFileName() + ".svg";
link.href = url;
link.click();
tip(
`${link.download} is saved. Open "Downloads" screen (ctrl + J) to check. You can set image scale in options`,
true,
"success",
5000
);
TIME && console.timeEnd("saveSVG");
const message = `${link.download} is saved. Open 'Downloads' screen (ctrl + J) to check`;
tip(message, true, "success", 5000);
TIME && console.timeEnd("exportToSvg");
}
// download map as PNG
async function savePNG() {
TIME && console.time("savePNG");
async function exportToPng() {
TIME && console.time("exportToPng");
const url = await getMapURL("png");
const link = document.createElement("a");
@ -41,22 +35,18 @@ async function savePNG() {
window.setTimeout(function () {
canvas.remove();
window.URL.revokeObjectURL(link.href);
tip(
`${link.download} is saved. Open "Downloads" screen (crtl + J) to check. You can set image scale in options`,
true,
"success",
5000
);
const message = `${link.download} is saved. Open 'Downloads' screen (ctrl + J) to check. You can set image scale in options`;
tip(message, true, "success", 5000);
}, 1000);
});
};
TIME && console.timeEnd("savePNG");
TIME && console.timeEnd("exportToPng");
}
// download map as JPEG
async function saveJPEG() {
TIME && console.time("saveJPEG");
async function exportToJpeg() {
TIME && console.time("exportToJpeg");
const url = await getMapURL("png");
const canvas = document.createElement("canvas");
@ -77,11 +67,10 @@ async function saveJPEG() {
window.setTimeout(() => window.URL.revokeObjectURL(URL), 5000);
};
TIME && console.timeEnd("saveJPEG");
TIME && console.timeEnd("exportToJpeg");
}
// download map as png tiles
async function saveTiles() {
async function exportToPngTiles() {
return new Promise(async (resolve, reject) => {
// download schema
const urlSchema = await getMapURL("tiles", {debug: true, fullMap: true});
@ -160,8 +149,6 @@ async function getMapURL(type, options = {}) {
fullMap = false
} = options;
if (fullMap) drawScaleBar(1);
const cloneEl = document.getElementById("map").cloneNode(true); // clone svg
cloneEl.id = "fantasyMap";
document.body.appendChild(cloneEl);
@ -183,13 +170,14 @@ async function getMapURL(type, options = {}) {
clone.select("#oceanBase").attr("opacity", 0);
clone.select("#oceanPattern").attr("opacity", 0);
}
if (noScaleBar) clone.select("#scaleBar")?.remove();
if (noIce) clone.select("#ice")?.remove();
if (noScaleBar) clone.select("#scaleBar")?.remove();
if (fullMap) {
// reset transform to show the whole map
clone.attr("width", graphWidth).attr("height", graphHeight);
clone.select("#viewbox").attr("transform", null);
drawScaleBar(scale);
drawScaleBar(clone.select("#scaleBar"), 1);
fitScaleBar(clone.select("#scaleBar"), graphWidth, graphHeight);
}
if (type === "svg") removeUnusedElements(clone);