diff --git a/heightmaps/africa-centric.png b/heightmaps/africa-centric.png new file mode 100644 index 00000000..b493c3ad Binary files /dev/null and b/heightmaps/africa-centric.png differ diff --git a/heightmaps/arabia.png b/heightmaps/arabia.png new file mode 100644 index 00000000..23e3e873 Binary files /dev/null and b/heightmaps/arabia.png differ diff --git a/heightmaps/atlantics.png b/heightmaps/atlantics.png new file mode 100644 index 00000000..04c2133a Binary files /dev/null and b/heightmaps/atlantics.png differ diff --git a/heightmaps/baltics.png b/heightmaps/baltics.png new file mode 100644 index 00000000..1bb311b5 Binary files /dev/null and b/heightmaps/baltics.png differ diff --git a/heightmaps/britain.png b/heightmaps/britain.png new file mode 100644 index 00000000..0b5acfac Binary files /dev/null and b/heightmaps/britain.png differ diff --git a/heightmaps/caribbean.png b/heightmaps/caribbean.png new file mode 100644 index 00000000..8f8c2fe5 Binary files /dev/null and b/heightmaps/caribbean.png differ diff --git a/heightmaps/east-asia.png b/heightmaps/east-asia.png new file mode 100644 index 00000000..8e929ae7 Binary files /dev/null and b/heightmaps/east-asia.png differ diff --git a/heightmaps/eurasia.png b/heightmaps/eurasia.png new file mode 100644 index 00000000..fcc6c3da Binary files /dev/null and b/heightmaps/eurasia.png differ diff --git a/heightmaps/europe-accented.png b/heightmaps/europe-accented.png new file mode 100644 index 00000000..a38cb5cd Binary files /dev/null and b/heightmaps/europe-accented.png differ diff --git a/heightmaps/europe-and-central-asia.png b/heightmaps/europe-and-central-asia.png new file mode 100644 index 00000000..d9f420b3 Binary files /dev/null and b/heightmaps/europe-and-central-asia.png differ diff --git a/heightmaps/europe-central.png b/heightmaps/europe-central.png new file mode 100644 index 00000000..b980d381 Binary files /dev/null and b/heightmaps/europe-central.png differ diff --git a/heightmaps/europe-north.png b/heightmaps/europe-north.png new file mode 100644 index 00000000..e6c12014 Binary files /dev/null and b/heightmaps/europe-north.png differ diff --git a/heightmaps/europe.png b/heightmaps/europe.png new file mode 100644 index 00000000..3432fb6a Binary files /dev/null and b/heightmaps/europe.png differ diff --git a/heightmaps/greenland.png b/heightmaps/greenland.png new file mode 100644 index 00000000..03d60464 Binary files /dev/null and b/heightmaps/greenland.png differ diff --git a/heightmaps/hellenica.png b/heightmaps/hellenica.png new file mode 100644 index 00000000..deb0258a Binary files /dev/null and b/heightmaps/hellenica.png differ diff --git a/heightmaps/iceland.png b/heightmaps/iceland.png new file mode 100644 index 00000000..045f229d Binary files /dev/null and b/heightmaps/iceland.png differ diff --git a/heightmaps/import-rules.txt b/heightmaps/import-rules.txt new file mode 100644 index 00000000..9478b35c --- /dev/null +++ b/heightmaps/import-rules.txt @@ -0,0 +1,8 @@ +To get heightmap with correct height scale: +1. Open tangrams.github.io +2. Toggle off auto-exposure +3. Set max elevation to 2000 +4. Set min elevation to -500 +5. Find region you like +6. Render image +7. Optionally rescale image to a smaller size (e.g. 500x300px) as high resolution is not used \ No newline at end of file diff --git a/heightmaps/india.png b/heightmaps/india.png new file mode 100644 index 00000000..e005ab0d Binary files /dev/null and b/heightmaps/india.png differ diff --git a/heightmaps/indian-ocean.png b/heightmaps/indian-ocean.png new file mode 100644 index 00000000..74ca8314 Binary files /dev/null and b/heightmaps/indian-ocean.png differ diff --git a/heightmaps/mediterranean-sea.png b/heightmaps/mediterranean-sea.png new file mode 100644 index 00000000..e296e7c7 Binary files /dev/null and b/heightmaps/mediterranean-sea.png differ diff --git a/heightmaps/middle-east.png b/heightmaps/middle-east.png new file mode 100644 index 00000000..57d03d4b Binary files /dev/null and b/heightmaps/middle-east.png differ diff --git a/heightmaps/north-america.png b/heightmaps/north-america.png new file mode 100644 index 00000000..51b42ebc Binary files /dev/null and b/heightmaps/north-america.png differ diff --git a/heightmaps/oceania.png b/heightmaps/oceania.png new file mode 100644 index 00000000..ab854d71 Binary files /dev/null and b/heightmaps/oceania.png differ diff --git a/heightmaps/philippines.png b/heightmaps/philippines.png new file mode 100644 index 00000000..8db168df Binary files /dev/null and b/heightmaps/philippines.png differ diff --git a/heightmaps/us-centric.png b/heightmaps/us-centric.png new file mode 100644 index 00000000..a73cbbe4 Binary files /dev/null and b/heightmaps/us-centric.png differ diff --git a/heightmaps/us-mainland.png b/heightmaps/us-mainland.png new file mode 100644 index 00000000..884f53c1 Binary files /dev/null and b/heightmaps/us-mainland.png differ diff --git a/heightmaps/world-from-pacific.png b/heightmaps/world-from-pacific.png new file mode 100644 index 00000000..3c7dbce5 Binary files /dev/null and b/heightmaps/world-from-pacific.png differ diff --git a/heightmaps/world.png b/heightmaps/world.png new file mode 100644 index 00000000..c54f4ab1 Binary files /dev/null and b/heightmaps/world.png differ diff --git a/main.js b/main.js index 713b5021..91d10032 100644 --- a/main.js +++ b/main.js @@ -253,7 +253,7 @@ function checkLoadParameters() { async function generateMapOnLoad() { await applyStyleOnLoad(); // apply previously selected default or custom style - generate(); // generate map + await generate(); // generate map focusOn(); // based on searchParams focus on point, cell or burg from MFCG applyPreset(); // apply saved layers preset } @@ -632,7 +632,7 @@ void (function addDragToUpload() { }); })(); -function generate() { +async function generate() { try { const timeStart = performance.now(); invokeActiveZooming(); @@ -643,7 +643,7 @@ function generate() { placePoints(); calculateVoronoi(grid, grid.points); drawScaleBar(); - HeightmapGenerator.generate(); + await HeightmapGenerator.generate(); markFeatures(); markupGridOcean(); addLakesInDeepDepressions(); @@ -929,6 +929,9 @@ function defineMapSize() { function getSizeAndLatitude() { const template = document.getElementById("templateInput").value; // heightmap template + + if (template === "europe") return [40, 50]; + const part = grid.features.some(f => f.land && f.border); // if land goes over map borders const max = part ? 80 : 100; // max size const lat = () => gauss(P(0.5) ? 40 : 60, 15, 25, 75); // latitude shift diff --git a/modules/heightmap-generator.js b/modules/heightmap-generator.js index a2567bfd..d079ec69 100644 --- a/modules/heightmap-generator.js +++ b/modules/heightmap-generator.js @@ -3,13 +3,43 @@ window.HeightmapGenerator = (function () { let cells, p; - const generate = function () { - TIME && console.time("generateHeightmap"); + const generate = async function () { cells = grid.cells; p = grid.points; cells.h = new Uint8Array(grid.points.length); - const template = document.getElementById("templateInput").value; + const input = document.getElementById("templateInput"); + const type = input.querySelector(`[value=${input.value}]`).parentElement.label; + + if (type === "Specific") { + // pre-defined heightmap + TIME && console.time("defineHeightmap"); + return new Promise(resolve => { + // create canvas where 1px correcponds to a cell + const canvas = document.createElement("canvas"); + const ctx = canvas.getContext("2d"); + const {cellsX, cellsY} = grid; + canvas.width = cellsX; + canvas.height = cellsY; + + // load heightmap into image and render to canvas + const img = new Image(); + img.src = `./heightmaps/${input.value}.png`; + img.onload = function () { + ctx.drawImage(img, 0, 0, cellsX, cellsY); + const imageData = ctx.getImageData(0, 0, cellsX, cellsY); + assignColorsToHeight(imageData.data); + canvas.remove(); + img.remove(); + TIME && console.timeEnd("defineHeightmap"); + resolve(); + }; + }); + } + + // heightmap template + TIME && console.time("generateHeightmap"); + const template = input.value; const templateString = HeightmapTemplates[template]; const steps = templateString.split("\n"); @@ -79,8 +109,8 @@ window.HeightmapGenerator = (function () { function addOneHill() { const change = new Uint8Array(cells.h.length); - let limit = 0, - start; + let limit = 0; + let start; let h = lim(getNumberInRange(height)); do { @@ -410,5 +440,13 @@ window.HeightmapGenerator = (function () { return rand(min * length, max * length); } + function assignColorsToHeight(imageData) { + for (let i = 0; i < cells.i.length; i++) { + const lightness = imageData[i * 4] / 255; + const powered = lightness < 0.2 ? lightness : 0.2 + (lightness - 0.2) ** 0.8; + cells.h[i] = minmax(rn(powered * 100), 0, 100); + } + } + return {generate, addHill, addRange, addTrough, addStrait, addPit, smooth, modify}; })(); diff --git a/modules/ui/heightmap-editor.js b/modules/ui/heightmap-editor.js index b4ebde9f..43200d26 100644 --- a/modules/ui/heightmap-editor.js +++ b/modules/ui/heightmap-editor.js @@ -913,11 +913,9 @@ function editHeightmap() { function uploadTemplate(dataLoaded) { const steps = dataLoaded.split("\r\n"); - if (!steps.length) { - tip("Cannot parse the template, please check the file", false, "error"); - return; - } + if (!steps.length) return tip("Cannot parse the template, please check the file", false, "error"); templateBody.innerHTML = ""; + for (const s of steps) { const step = s.split(" "); if (step.length !== 5) {