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

refactor: drawCoastline and createDefaultRuler

Browse source
This commit is contained in:
Azgaar 2024-09-06 02:02:43 +02:00
parent 2ebc2e9733
commit 088faf9e26
12 changed files with 207 additions and 180 deletions
Download patch file Download diff file Expand all files Collapse all files

53
index.html
View file

@ -138,7 +138,7 @@
}
</style>
<link rel="preload" href="index.css?v=1.104.00" as="style" onload="this.onload=null; this.rel='stylesheet'" />
<link rel="preload" href="index.css?v=1.104.0" as="style" onload="this.onload=null; this.rel='stylesheet'" />
<link rel="preload" href="icons.css" as="style" onload="this.onload=null; this.rel='stylesheet'" />
<link rel="preload" href="libs/jquery-ui.css" as="style" onload="this.onload=null; this.rel='stylesheet'" />
</head>
@ -8019,29 +8019,29 @@
<script src="utils/stringUtils.js?v=1.99.00"></script>
<script src="utils/languageUtils.js?v=1.99.00"></script>
<script src="utils/unitUtils.js?v=1.99.00"></script>
<script src="utils/pathUtils.js?v=1.104.00"></script>
<script src="utils/pathUtils.js?v=1.104.0"></script>
<script defer src="utils/debugUtils.js?v=1.99.00"></script>
<script src="modules/voronoi.js"></script>
<script src="config/heightmap-templates.js"></script>
<script src="config/precreated-heightmaps.js"></script>
<script src="modules/heightmap-generator.js?v=1.99.00"></script>
<script src="modules/ocean-layers.js?v=1.104.00"></script>
<script src="modules/ocean-layers.js?v=1.104.0"></script>
<script src="modules/river-generator.js?v=1.99.05"></script>
<script src="modules/lakes.js?v=1.99.00"></script>
<script src="modules/biomes.js?v=1.99.00"></script>
<script src="modules/names-generator.js?v=1.87.14"></script>
<script src="modules/cultures-generator.js?v=1.99.05"></script>
<script src="modules/renderers/draw-state-labels.js?v=1.104.00"></script>
<script src="modules/burgs-and-states.js?v=1.104.00"></script>
<script src="modules/provinces-generator.js?v=1.104.00"></script>
<script src="modules/renderers/draw-state-labels.js?v=1.104.0"></script>
<script src="modules/burgs-and-states.js?v=1.104.0"></script>
<script src="modules/provinces-generator.js?v=1.104.0"></script>
<script src="modules/routes-generator.js?v=1.99.04"></script>
<script src="modules/religions-generator.js?v=1.99.05"></script>
<script src="modules/military-generator.js?v=1.104.00"></script>
<script src="modules/military-generator.js?v=1.104.0"></script>
<script src="modules/markers-generator.js?v=1.99.00"></script>
<script src="modules/zones-generator.js?v=1.100.00"></script>
<script src="modules/coa-generator.js?v=1.99.00"></script>
<script src="modules/submap.js?v=1.104.00"></script>
<script src="modules/submap.js?v=1.104.0"></script>
<script src="libs/polylabel.min.js"></script>
<script src="libs/lineclip.min.js"></script>
<script src="libs/alea.min.js"></script>
@ -8050,17 +8050,17 @@
<script src="modules/ui/measurers.js?v=1.99.00"></script>
<script src="modules/ui/style-presets.js?v=1.100.00"></script>
<script src="modules/ui/general.js?v=1.104.00"></script>
<script src="modules/ui/general.js?v=1.104.0"></script>
<script src="modules/ui/options.js?v=1.100.00"></script>
<script src="main.js?v=1.104.00"></script>
<script src="main.js?v=1.104.0"></script>
<script defer src="modules/relief-icons.js?v=1.99.05"></script>
<script defer src="modules/ui/style.js?v=1.104.00"></script>
<script defer src="modules/ui/style.js?v=1.104.0"></script>
<script defer src="modules/ui/editors.js?v=1.99.05"></script>
<script defer src="modules/ui/tools.js?v=1.104.00"></script>
<script defer src="modules/ui/world-configurator.js?v=1.104.00"></script>
<script defer src="modules/ui/heightmap-editor.js?v=1.104.00"></script>
<script defer src="modules/ui/provinces-editor.js?v=1.104.00"></script>
<script defer src="modules/ui/tools.js?v=1.104.0"></script>
<script defer src="modules/ui/world-configurator.js?v=1.104.0"></script>
<script defer src="modules/ui/heightmap-editor.js?v=1.104.0"></script>
<script defer src="modules/ui/provinces-editor.js?v=1.104.0"></script>
<script defer src="modules/ui/biomes-editor.js?v=1.99.05"></script>
<script defer src="modules/ui/namesbase-editor.js?v=1.99.00"></script>
<script defer src="modules/ui/elevation-profile.js?v=1.99.00"></script>
@ -8076,7 +8076,7 @@
<script defer src="modules/ui/rivers-creator.js?v=1.99.00"></script>
<script defer src="modules/ui/relief-editor.js?v=1.99.00"></script>
<script defer src="modules/ui/burg-editor.js?v=1.100.00"></script>
<script defer src="modules/ui/units-editor.js?v=1.104.00"></script>
<script defer src="modules/ui/units-editor.js?v=1.104.0"></script>
<script defer src="modules/ui/notes-editor.js?v=1.99.06"></script>
<script defer src="modules/ui/ai-generator.js?v=1.99.09"></script>
<script defer src="modules/ui/diplomacy-editor.js?v=1.99.00"></script>
@ -8085,7 +8085,7 @@
<script defer src="modules/ui/routes-overview.js?v=1.100.00"></script>
<script defer src="modules/ui/rivers-overview.js?v=1.99.00"></script>
<script defer src="modules/ui/military-overview.js?v=1.99.00"></script>
<script defer src="modules/ui/regiments-overview.js?v=1.104.00"></script>
<script defer src="modules/ui/regiments-overview.js?v=1.104.0"></script>
<script defer src="modules/ui/markers-overview.js?v=1.99.00"></script>
<script defer src="modules/ui/regiment-editor.js?v=1.99.00"></script>
<script defer src="modules/ui/battle-screen.js?v=1.99.00"></script>
@ -8093,21 +8093,22 @@
<script defer src="modules/ui/markers-editor.js?v=1.99.00"></script>
<script defer src="modules/ui/3d.js?v=1.99.00"></script>
<script defer src="modules/ui/submap.js?v=1.99.10"></script>
<script defer src="modules/ui/hotkeys.js?v=1.104.00"></script>
<script defer src="modules/ui/hotkeys.js?v=1.104.0"></script>
<script defer src="modules/coa-renderer.js?v=1.99.00"></script>
<script defer src="libs/rgbquant.min.js"></script>
<script defer src="libs/jquery.ui.touch-punch.min.js"></script>
<script defer src="modules/io/save.js?v=1.100.00"></script>
<script defer src="modules/io/load.js?v=1.104.00"></script>
<script defer src="modules/io/load.js?v=1.104.0"></script>
<script defer src="modules/io/cloud.js?v=1.99.00"></script>
<script defer src="modules/io/export.js?v=1.100.00"></script>
<script defer src="modules/renderers/draw-borders.js?v=1.104.00"></script>
<script defer src="modules/renderers/draw-heightmap.js?v=1.104.00"></script>
<script defer src="modules/renderers/draw-markers.js?v=1.104.00"></script>
<script defer src="modules/renderers/draw-scalebar.js?v=1.104.00"></script>
<script defer src="modules/renderers/draw-temperature.js?v=1.104.00"></script>
<script defer src="modules/renderers/draw-emblems.js?v=1.104.00"></script>
<script defer src="modules/renderers/draw-military.js?v=1.104.00"></script>
<script defer src="modules/renderers/draw-coastline.js?v=1.104.0"></script>
<script defer src="modules/renderers/draw-borders.js?v=1.104.0"></script>
<script defer src="modules/renderers/draw-heightmap.js?v=1.104.0"></script>
<script defer src="modules/renderers/draw-markers.js?v=1.104.0"></script>
<script defer src="modules/renderers/draw-scalebar.js?v=1.104.0"></script>
<script defer src="modules/renderers/draw-temperature.js?v=1.104.0"></script>
<script defer src="modules/renderers/draw-emblems.js?v=1.104.0"></script>
<script defer src="modules/renderers/draw-military.js?v=1.104.0"></script>
</body>
</html>

143
main.js
View file

@ -638,7 +638,9 @@ async function generate(options) {
generatePrecipitation();
reGraph();
reMarkFeatures();
drawCoastline();
createDefaultRuler();
Rivers.generate();
Lakes.defineGroup();
@ -1220,146 +1222,6 @@ function reGraph() {
TIME && console.timeEnd("reGraph");
}
// Detect and draw the coastline
function drawCoastline() {
TIME && console.time("drawCoastline");
reMarkFeatures();
const cells = pack.cells,
vertices = pack.vertices,
n = cells.i.length,
features = pack.features;
const used = new Uint8Array(features.length); // store connected features
const largestLand = d3.scan(
features.map(f => (f.land ? f.cells : 0)),
(a, b) => b - a
);
const landMask = defs.select("#land");
const waterMask = defs.select("#water");
lineGen.curve(d3.curveBasisClosed);
for (const i of cells.i) {
const startFromEdge = !i && cells.h[i] >= 20;
if (!startFromEdge && cells.t[i] !== -1 && cells.t[i] !== 1) continue; // non-edge cell
const f = cells.f[i];
if (used[f]) continue; // already connected
if (features[f].type === "ocean") continue; // ocean cell
const type = features[f].type === "lake" ? 1 : -1; // type value to search for
const start = findStart(i, type);
if (start === -1) continue; // cannot start here
let vchain = connectVertices(start, type);
if (features[f].type === "lake") relax(vchain, 1.2);
used[f] = 1;
let points = clipPoly(
vchain.map(v => vertices.p[v]),
1
);
const area = d3.polygonArea(points); // area with lakes/islands
if (area > 0 && features[f].type === "lake") {
points = points.reverse();
vchain = vchain.reverse();
}
features[f].area = Math.abs(area);
features[f].vertices = vchain;
const path = round(lineGen(points));
if (features[f].type === "lake") {
landMask
.append("path")
.attr("d", path)
.attr("fill", "black")
.attr("id", "land_" + f);
// waterMask.append("path").attr("d", path).attr("fill", "white").attr("id", "water_"+id); // uncomment to show over lakes
lakes
.select("#freshwater")
.append("path")
.attr("d", path)
.attr("id", "lake_" + f)
.attr("data-f", f); // draw the lake
} else {
landMask
.append("path")
.attr("d", path)
.attr("fill", "white")
.attr("id", "land_" + f);
waterMask
.append("path")
.attr("d", path)
.attr("fill", "black")
.attr("id", "water_" + f);
const g = features[f].group === "lake_island" ? "lake_island" : "sea_island";
coastline
.select("#" + g)
.append("path")
.attr("d", path)
.attr("id", "island_" + f)
.attr("data-f", f); // draw the coastline
}
// draw ruler to cover the biggest land piece
if (f === largestLand) {
const from = points[d3.scan(points, (a, b) => a[0] - b[0])];
const to = points[d3.scan(points, (a, b) => b[0] - a[0])];
rulers.create(Ruler, [from, to]);
}
}
// find cell vertex to start path detection
function findStart(i, t) {
if (t === -1 && cells.b[i]) return cells.v[i].find(v => vertices.c[v].some(c => c >= n)); // map border cell
const filtered = cells.c[i].filter(c => cells.t[c] === t);
const index = cells.c[i].indexOf(d3.min(filtered));
return index === -1 ? index : cells.v[i][index];
}
// connect vertices to chain
function connectVertices(start, t) {
const chain = []; // vertices chain to form a path
for (let i = 0, current = start; i === 0 || (current !== start && i < 50000); i++) {
const prev = chain[chain.length - 1]; // previous vertex in chain
chain.push(current); // add current vertex to sequence
const c = vertices.c[current]; // cells adjacent to vertex
const v = vertices.v[current]; // neighboring vertices
const c0 = c[0] >= n || cells.t[c[0]] === t;
const c1 = c[1] >= n || cells.t[c[1]] === t;
const c2 = c[2] >= n || cells.t[c[2]] === t;
if (v[0] !== prev && c0 !== c1) current = v[0];
else if (v[1] !== prev && c1 !== c2) current = v[1];
else if (v[2] !== prev && c0 !== c2) current = v[2];
if (current === chain[chain.length - 1]) {
ERROR && console.error("Next vertex is not found");
break;
}
}
return chain;
}
// move vertices that are too close to already added ones
function relax(vchain, r) {
const p = vertices.p,
tree = d3.quadtree();
for (let i = 0; i < vchain.length; i++) {
const v = vchain[i];
let [x, y] = [p[v][0], p[v][1]];
if (i && vchain[i + 1] && tree.find(x, y, r) !== undefined) {
const v1 = vchain[i - 1],
v2 = vchain[i + 1];
const [x1, y1] = [p[v1][0], p[v1][1]];
const [x2, y2] = [p[v2][0], p[v2][1]];
[x, y] = [(x1 + x2) / 2, (y1 + y2) / 2];
p[v] = [x, y];
}
tree.add([x, y]);
}
}
TIME && console.timeEnd("drawCoastline");
}
// Re-mark features (ocean, lakes, islands)
function reMarkFeatures() {
TIME && console.time("reMarkFeatures");
@ -1540,6 +1402,5 @@ function undraw() {
.forEach(el => el.remove());
byId("coas").innerHTML = ""; // remove auto-generated emblems
notes = [];
rulers = new Rulers();
unfog();
}

9
modules/dynamic/auto-update.js
View file

@ -201,7 +201,10 @@ export function resolveVersionConflicts(mapVersion) {
defs.select("#water").selectAll("path").remove();
coastline.selectAll("path").remove();
lakes.selectAll("path").remove();
reMarkFeatures();
drawCoastline();
createDefaultRuler();
}
if (isOlderThan("1.11.0")) {
@ -940,12 +943,12 @@ export function resolveVersionConflicts(mapVersion) {
if (layerIsOn("toggleZones")) drawZones();
}
if (isOlderThan("1.103.0")) {
// v1.103.00 separated pole of inaccessibility detection from layer rendering
if (isOlderThan("1.104.0")) {
// v1.104.00 separated pole of inaccessibility detection from layer rendering
BurgsAndStates.getPoles();
Provinces.getPoles();
// v1.103.00 removed regiments from initial render
// v1.104.00 removed regiments from initial render
viewbox.select("#armies").style("display", null);
}
}

2
modules/io/load.js
View file

@ -462,7 +462,7 @@ async function parseLoadedData(data, mapVersion) {
{
// dynamically import and run auto-update script
const {resolveVersionConflicts} = await import("../dynamic/auto-update.js?v=1.104.00");
const {resolveVersionConflicts} = await import("../dynamic/auto-update.js?v=1.104.0");
resolveVersionConflicts(mapVersion);
}

127
modules/renderers/draw-coastline.js Normal file
View file

@ -0,0 +1,127 @@
"use strict";
function drawCoastline() {
TIME && console.time("drawCoastline");
const {cells, vertices, features} = pack;
const n = cells.i.length;
const used = new Uint8Array(features.length); // store connected features
const landMask = defs.select("#land");
const waterMask = defs.select("#water");
lineGen.curve(d3.curveBasisClosed);
for (const i of cells.i) {
const startFromEdge = !i && cells.h[i] >= 20;
if (!startFromEdge && cells.t[i] !== -1 && cells.t[i] !== 1) continue; // non-edge cell
const f = cells.f[i];
if (used[f]) continue; // already connected
if (features[f].type === "ocean") continue; // ocean cell
const type = features[f].type === "lake" ? 1 : -1; // type value to search for
const start = findStart(i, type);
if (start === -1) continue; // cannot start here
let vchain = connectVertices(start, type);
if (features[f].type === "lake") relax(vchain, 1.2);
used[f] = 1;
let points = clipPoly(
vchain.map(v => vertices.p[v]),
1
);
const area = d3.polygonArea(points); // area with lakes/islands
if (area > 0 && features[f].type === "lake") {
points = points.reverse();
vchain = vchain.reverse();
}
features[f].area = Math.abs(area);
features[f].vertices = vchain;
const path = round(lineGen(points));
if (features[f].type === "lake") {
landMask
.append("path")
.attr("d", path)
.attr("fill", "black")
.attr("id", "land_" + f);
lakes
.select("#freshwater")
.append("path")
.attr("d", path)
.attr("id", "lake_" + f)
.attr("data-f", f); // draw the lake
} else {
landMask
.append("path")
.attr("d", path)
.attr("fill", "white")
.attr("id", "land_" + f);
waterMask
.append("path")
.attr("d", path)
.attr("fill", "black")
.attr("id", "water_" + f);
const g = features[f].group === "lake_island" ? "lake_island" : "sea_island";
coastline
.select("#" + g)
.append("path")
.attr("d", path)
.attr("id", "island_" + f)
.attr("data-f", f); // draw the coastline
}
}
// find cell vertex to start path detection
function findStart(i, t) {
if (t === -1 && cells.b[i]) return cells.v[i].find(v => vertices.c[v].some(c => c >= n)); // map border cell
const filtered = cells.c[i].filter(c => cells.t[c] === t);
const index = cells.c[i].indexOf(d3.min(filtered));
return index === -1 ? index : cells.v[i][index];
}
// connect vertices to chain
function connectVertices(start, t) {
const chain = []; // vertices chain to form a path
for (let i = 0, current = start; i === 0 || (current !== start && i < 50000); i++) {
const prev = chain[chain.length - 1]; // previous vertex in chain
chain.push(current); // add current vertex to sequence
const c = vertices.c[current]; // cells adjacent to vertex
const v = vertices.v[current]; // neighboring vertices
const c0 = c[0] >= n || cells.t[c[0]] === t;
const c1 = c[1] >= n || cells.t[c[1]] === t;
const c2 = c[2] >= n || cells.t[c[2]] === t;
if (v[0] !== prev && c0 !== c1) current = v[0];
else if (v[1] !== prev && c1 !== c2) current = v[1];
else if (v[2] !== prev && c0 !== c2) current = v[2];
if (current === chain[chain.length - 1]) {
ERROR && console.error("Next vertex is not found");
break;
}
}
return chain;
}
// move vertices that are too close to already added ones
function relax(vchain, r) {
const p = vertices.p,
tree = d3.quadtree();
for (let i = 0; i < vchain.length; i++) {
const v = vchain[i];
let [x, y] = [p[v][0], p[v][1]];
if (i && vchain[i + 1] && tree.find(x, y, r) !== undefined) {
const v1 = vchain[i - 1],
v2 = vchain[i + 1];
const [x1, y1] = [p[v1][0], p[v1][1]];
const [x2, y2] = [p[v2][0], p[v2][1]];
[x, y] = [(x1 + x2) / 2, (y1 + y2) / 2];
p[v] = [x, y];
}
tree.add([x, y]);
}
}
TIME && console.timeEnd("drawCoastline");
}

7
modules/submap.js
View file

@ -130,13 +130,12 @@ window.Submap = (function () {
// remove misclassified cells
stage("Define coastline");
reMarkFeatures();
drawCoastline();
createDefaultRuler();
/****************************************************/
/* Packed Graph */
/****************************************************/
// Packed Graph
const oldCells = parentMap.pack.cells;
// const reverseMap = new Map(); // cellmap from new -> oldcell
const forwardMap = parentMap.pack.cells.p.map(_ => []); // old -> [newcelllist]
const pn = pack.cells.i.length;

6
modules/ui/coastline-editor.js
View file

@ -1,4 +1,5 @@
"use strict";
function editCoastline(node = d3.event.target) {
if (customization) return;
closeDialogs(".stable");
@ -55,7 +56,9 @@ function editCoastline(node = d3.event.target) {
.attr("r", 0.4)
.attr("data-v", d => d)
.call(d3.drag().on("drag", dragVertex))
.on("mousemove", () => tip("Drag to move the vertex, please use for fine-tuning only. Edit heightmap to change actual cell heights"));
.on("mousemove", () =>
tip("Drag to move the vertex, please use for fine-tuning only. Edit heightmap to change actual cell heights")
);
const area = pack.features[f].area;
coastlineArea.innerHTML = si(getArea(area)) + " " + getAreaUnit();
@ -72,6 +75,7 @@ function editCoastline(node = d3.event.target) {
.select("#vertices")
.selectAll("polygon")
.attr("points", d => getPackPolygon(d));
redrawCoastline();
}

6
modules/ui/editors.js
View file

@ -1252,18 +1252,18 @@ function refreshAllEditors() {
// dynamically loaded editors
async function editStates() {
if (customization) return;
const Editor = await import("../dynamic/editors/states-editor.js?v=1.104.00");
const Editor = await import("../dynamic/editors/states-editor.js?v=1.104.0");
Editor.open();
}
async function editCultures() {
if (customization) return;
const Editor = await import("../dynamic/editors/cultures-editor.js?v=1.104.00");
const Editor = await import("../dynamic/editors/cultures-editor.js?v=1.104.0");
Editor.open();
}
async function editReligions() {
if (customization) return;
const Editor = await import("../dynamic/editors/religions-editor.js?v=1.104.00");
const Editor = await import("../dynamic/editors/religions-editor.js?v=1.104.0");
Editor.open();
}

2
modules/ui/heightmap-editor.js
View file

@ -225,6 +225,7 @@ function editHeightmap(options) {
calculateTemperatures();
generatePrecipitation();
reGraph();
reMarkFeatures();
drawCoastline();
Rivers.generate(erosionAllowed);
@ -343,6 +344,7 @@ function editHeightmap(options) {
calculateTemperatures();
generatePrecipitation();
reGraph();
reMarkFeatures();
drawCoastline();
if (erosionAllowed) Rivers.generate(true);

1
modules/ui/layers.js
View file

@ -186,6 +186,7 @@ function restoreLayers() {
if (layerIsOn("toggleStates")) drawStates();
if (layerIsOn("toggleRivers")) drawRivers();
if (layerIsOn("toggleMilitary")) drawMilitary();
if (layerIsOn("toggleRulers")) rulers.draw();
}
function toggleHeight(event) {

29
modules/ui/measurers.js
View file

@ -530,3 +530,32 @@ class Planimeter extends Measurer {
this.el.select("text").attr("x", c[0]).attr("y", c[1]).text(area);
}
}
function createDefaultRuler() {
TIME && console.time("createDefaultRuler");
const {features, vertices} = pack;
const areas = features.map(f => (f.land ? f.area || 0 : -Infinity));
const largestLand = areas.indexOf(Math.max(...areas));
const featureVertices = features[largestLand].vertices;
const MIN_X = 100;
const MAX_X = graphWidth - 100;
const MIN_Y = 100;
const MAX_Y = graphHeight - 100;
let leftmostVertex = [graphWidth - MIN_X, graphHeight / 2];
let rightmostVertex = [MIN_X, graphHeight / 2];
for (const vertex of featureVertices) {
const [x, y] = vertices.p[vertex];
if (y < MIN_Y || y > MAX_Y) continue;
if (x < leftmostVertex[0] && x >= MIN_X) leftmostVertex = [x, y];
if (x > rightmostVertex[0] && x <= MAX_X) rightmostVertex = [x, y];
}
rulers = new Rulers();
rulers.create(Ruler, [leftmostVertex, rightmostVertex]);
TIME && console.timeEnd("createDefaultRuler");
}

2
versioning.js
View file

@ -12,7 +12,7 @@
*
* Example: 1.102.0 -> Major version 1, Minor version 102, Patch version 0
*/
const VERSION = "1.104.00";
const VERSION = "1.104.0";
{
document.title += " v" + VERSION;