mirror of
https://github.com/Azgaar/Fantasy-Map-Generator.git
synced 2026-02-05 01:51:23 +01:00
refactor: Remove legacy ocean-layers.js and migrate functionality to ocean-layers.ts
This commit is contained in:
Marc Emmanuel
parent
3e8c7a28a7
commit
9733db81f4
4 changed files with 123 additions and 94 deletions
|
|
@ -1,92 +0,0 @@
|
||||||
"use strict";
|
|
||||||
|
|
||||||
window.OceanLayers = (function () {
|
|
||||||
let cells, vertices, pointsN, used;
|
|
||||||
|
|
||||||
const OceanLayers = function OceanLayers() {
|
|
||||||
const outline = oceanLayers.attr("layers");
|
|
||||||
if (outline === "none") return;
|
|
||||||
TIME && console.time("drawOceanLayers");
|
|
||||||
|
|
||||||
lineGen.curve(d3.curveBasisClosed);
|
|
||||||
(cells = grid.cells), (pointsN = grid.cells.i.length), (vertices = grid.vertices);
|
|
||||||
const limits = outline === "random" ? randomizeOutline() : outline.split(",").map(s => +s);
|
|
||||||
|
|
||||||
const chains = [];
|
|
||||||
const opacity = rn(0.4 / limits.length, 2);
|
|
||||||
used = new Uint8Array(pointsN); // to detect already passed cells
|
|
||||||
|
|
||||||
for (const i of cells.i) {
|
|
||||||
const t = cells.t[i];
|
|
||||||
if (t > 0) continue;
|
|
||||||
if (used[i] || !limits.includes(t)) continue;
|
|
||||||
const start = findStart(i, t);
|
|
||||||
if (!start) continue;
|
|
||||||
used[i] = 1;
|
|
||||||
const chain = connectVertices(start, t); // vertices chain to form a path
|
|
||||||
if (chain.length < 4) continue;
|
|
||||||
const relax = 1 + t * -2; // select only n-th point
|
|
||||||
const relaxed = chain.filter((v, i) => !(i % relax) || vertices.c[v].some(c => c >= pointsN));
|
|
||||||
if (relaxed.length < 4) continue;
|
|
||||||
const points = clipPoly(
|
|
||||||
relaxed.map(v => vertices.p[v]),
|
|
||||||
1
|
|
||||||
);
|
|
||||||
chains.push([t, points]);
|
|
||||||
}
|
|
||||||
|
|
||||||
for (const t of limits) {
|
|
||||||
const layer = chains.filter(c => c[0] === t);
|
|
||||||
let path = layer.map(c => round(lineGen(c[1]))).join("");
|
|
||||||
if (path) oceanLayers.append("path").attr("d", path).attr("fill", "#ecf2f9").attr("fill-opacity", opacity);
|
|
||||||
}
|
|
||||||
|
|
||||||
// find eligible cell vertex to start path detection
|
|
||||||
function findStart(i, t) {
|
|
||||||
if (cells.b[i]) return cells.v[i].find(v => vertices.c[v].some(c => c >= pointsN)); // map border cell
|
|
||||||
return cells.v[i][cells.c[i].findIndex(c => cells.t[c] < t || !cells.t[c])];
|
|
||||||
}
|
|
||||||
|
|
||||||
TIME && console.timeEnd("drawOceanLayers");
|
|
||||||
};
|
|
||||||
|
|
||||||
function randomizeOutline() {
|
|
||||||
const limits = [];
|
|
||||||
let odd = 0.2;
|
|
||||||
for (let l = -9; l < 0; l++) {
|
|
||||||
if (P(odd)) {
|
|
||||||
odd = 0.2;
|
|
||||||
limits.push(l);
|
|
||||||
} else {
|
|
||||||
odd *= 2;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return limits;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 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 < 10000); 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
|
|
||||||
c.filter(c => cells.t[c] === t).forEach(c => (used[c] = 1));
|
|
||||||
const v = vertices.v[current]; // neighboring vertices
|
|
||||||
const c0 = !cells.t[c[0]] || cells.t[c[0]] === t - 1;
|
|
||||||
const c1 = !cells.t[c[1]] || cells.t[c[1]] === t - 1;
|
|
||||||
const c2 = !cells.t[c[2]] || cells.t[c[2]] === t - 1;
|
|
||||||
if (v[0] !== undefined && v[0] !== prev && c0 !== c1) current = v[0];
|
|
||||||
else if (v[1] !== undefined && v[1] !== prev && c1 !== c2) current = v[1];
|
|
||||||
else if (v[2] !== undefined && v[2] !== prev && c0 !== c2) current = v[2];
|
|
||||||
if (current === chain[chain.length - 1]) {
|
|
||||||
ERROR && console.error("Next vertex is not found");
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
chain.push(chain[0]); // push first vertex as the last one
|
|
||||||
return chain;
|
|
||||||
}
|
|
||||||
|
|
||||||
return OceanLayers;
|
|
||||||
})();
|
|
||||||
|
|
@ -8469,7 +8469,6 @@
|
||||||
|
|
||||||
<script defer src="config/heightmap-templates.js"></script>
|
<script defer src="config/heightmap-templates.js"></script>
|
||||||
<script defer src="config/precreated-heightmaps.js"></script>
|
<script defer src="config/precreated-heightmaps.js"></script>
|
||||||
<script defer src="modules/ocean-layers.js?v=1.108.4"></script>
|
|
||||||
<script defer src="modules/river-generator.js?v=1.106.7"></script>
|
<script defer src="modules/river-generator.js?v=1.106.7"></script>
|
||||||
<script defer src="modules/lakes.js?v=1.99.00"></script>
|
<script defer src="modules/lakes.js?v=1.99.00"></script>
|
||||||
<script defer src="modules/biomes.js?v=1.99.00"></script>
|
<script defer src="modules/biomes.js?v=1.99.00"></script>
|
||||||
|
|
|
||||||
|
|
@ -1,3 +1,4 @@
|
||||||
import "./voronoi";
|
import "./voronoi";
|
||||||
import "./heightmap-generator";
|
import "./heightmap-generator";
|
||||||
import "./features";
|
import "./features";
|
||||||
|
import "./ocean-layers";
|
||||||
121
src/modules/ocean-layers.ts
Normal file
121
src/modules/ocean-layers.ts
Normal file
|
|
@ -0,0 +1,121 @@
|
||||||
|
import { line, curveBasisClosed } from 'd3';
|
||||||
|
import type { Selection } from 'd3';
|
||||||
|
import { clipPoly,P,rn,round } from '../utils';
|
||||||
|
|
||||||
|
declare global {
|
||||||
|
interface Window {
|
||||||
|
OceanLayers: any;
|
||||||
|
}
|
||||||
|
|
||||||
|
var TIME: boolean;
|
||||||
|
var ERROR: boolean;
|
||||||
|
var grid: any;
|
||||||
|
var oceanLayers: Selection<SVGGElement, unknown, null, undefined>;
|
||||||
|
}
|
||||||
|
class OceanModule {
|
||||||
|
private cells: any;
|
||||||
|
private vertices: any;
|
||||||
|
private pointsN: any;
|
||||||
|
private used: any;
|
||||||
|
private lineGen = line().curve(curveBasisClosed);
|
||||||
|
private oceanLayers: Selection<SVGGElement, unknown, null, undefined>;
|
||||||
|
|
||||||
|
|
||||||
|
constructor(oceanLayers: Selection<SVGGElement, unknown, null, undefined>) {
|
||||||
|
this.oceanLayers = oceanLayers;
|
||||||
|
}
|
||||||
|
|
||||||
|
get grid(): any {
|
||||||
|
return grid;
|
||||||
|
}
|
||||||
|
|
||||||
|
randomizeOutline() {
|
||||||
|
const limits = [];
|
||||||
|
let odd = 0.2;
|
||||||
|
for (let l = -9; l < 0; l++) {
|
||||||
|
if (P(odd)) {
|
||||||
|
odd = 0.2;
|
||||||
|
limits.push(l);
|
||||||
|
} else {
|
||||||
|
odd *= 2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return limits;
|
||||||
|
}
|
||||||
|
|
||||||
|
// connect vertices to chain
|
||||||
|
connectVertices(start: number, t: number) {
|
||||||
|
const chain = []; // vertices chain to form a path
|
||||||
|
for (let i = 0, current = start; i === 0 || (current !== start && i < 10000); i++) {
|
||||||
|
const prev = chain[chain.length - 1]; // previous vertex in chain
|
||||||
|
chain.push(current); // add current vertex to sequence
|
||||||
|
const c = this.vertices.c[current]; // cells adjacent to vertex
|
||||||
|
c.filter((c: number) => this.cells.t[c] === t).forEach((c: number) => (this.used[c] = 1));
|
||||||
|
const v = this.vertices.v[current]; // neighboring vertices
|
||||||
|
const c0 = !this.cells.t[c[0]] || this.cells.t[c[0]] === t - 1;
|
||||||
|
const c1 = !this.cells.t[c[1]] || this.cells.t[c[1]] === t - 1;
|
||||||
|
const c2 = !this.cells.t[c[2]] || this.cells.t[c[2]] === t - 1;
|
||||||
|
if (v[0] !== undefined && v[0] !== prev && c0 !== c1) current = v[0];
|
||||||
|
else if (v[1] !== undefined && v[1] !== prev && c1 !== c2) current = v[1];
|
||||||
|
else if (v[2] !== undefined && v[2] !== prev && c0 !== c2) current = v[2];
|
||||||
|
if (current === chain[chain.length - 1]) {
|
||||||
|
ERROR && console.error("Next vertex is not found");
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
chain.push(chain[0]); // push first vertex as the last one
|
||||||
|
return chain;
|
||||||
|
}
|
||||||
|
|
||||||
|
// find eligible cell vertex to start path detection
|
||||||
|
findStart(i: number, t: number) {
|
||||||
|
if (this.cells.b[i]) return this.cells.v[i].find((v: number) => this.vertices.c[v].some((c: number) => c >= this.pointsN)); // map border cell
|
||||||
|
return this.cells.v[i][this.cells.c[i].findIndex((c: number)=> this.cells.t[c] < t || !this.cells.t[c])];
|
||||||
|
}
|
||||||
|
|
||||||
|
draw() {
|
||||||
|
const outline = this.oceanLayers.attr("layers");
|
||||||
|
if (outline === "none") return;
|
||||||
|
TIME && console.time("drawOceanLayers");
|
||||||
|
this.cells = grid.cells;
|
||||||
|
this.pointsN = grid.cells.i.length;
|
||||||
|
this.vertices = grid.vertices;
|
||||||
|
const limits = outline === "random" ? this.randomizeOutline() : outline.split(",").map((s: string) => +s);
|
||||||
|
|
||||||
|
const chains: [number, any[]][] = [];
|
||||||
|
const opacity = rn(0.4 / limits.length, 2);
|
||||||
|
this.used = new Uint8Array(this.pointsN); // to detect already passed cells
|
||||||
|
|
||||||
|
for (const i of this.cells.i) {
|
||||||
|
const t = this.cells.t[i];
|
||||||
|
if (t > 0) continue;
|
||||||
|
if (this.used[i] || !limits.includes(t)) continue;
|
||||||
|
const start = this.findStart(i, t);
|
||||||
|
if (!start) continue;
|
||||||
|
this.used[i] = 1;
|
||||||
|
const chain = this.connectVertices(start, t); // vertices chain to form a path
|
||||||
|
if (chain.length < 4) continue;
|
||||||
|
const relax = 1 + t * -2; // select only n-th point
|
||||||
|
const relaxed = chain.filter((v, i) => !(i % relax) || this.vertices.c[v].some((c: number) => c >= this.pointsN));
|
||||||
|
if (relaxed.length < 4) continue;
|
||||||
|
|
||||||
|
const points = clipPoly(
|
||||||
|
relaxed.map(v => this.vertices.p[v]),
|
||||||
|
undefined,
|
||||||
|
undefined,
|
||||||
|
1
|
||||||
|
);
|
||||||
|
chains.push([t, points]);
|
||||||
|
}
|
||||||
|
|
||||||
|
for (const t of limits) {
|
||||||
|
const layer = chains.filter((c: [number, any[]]) => c[0] === t);
|
||||||
|
let path = layer.map((c: [number, any[]]) => round(this.lineGen(c[1]) || "")).join("");
|
||||||
|
if (path) this.oceanLayers.append("path").attr("d", path).attr("fill", "#ecf2f9").attr("fill-opacity", opacity);
|
||||||
|
}
|
||||||
|
|
||||||
|
TIME && console.timeEnd("drawOceanLayers");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
window.OceanLayers = () => new OceanModule(oceanLayers).draw();
|
||||||
Loading…
Add table
Add a link
Reference in a new issue