mirror of
https://github.com/Azgaar/Fantasy-Map-Generator.git
synced 2025-12-22 12:01:23 +01:00
Merge branch 'master' into geodata
This commit is contained in:
Tom Vogt
commit
552d4ef4dc
19 changed files with 306 additions and 105 deletions
|
|
@ -588,9 +588,9 @@
|
|||
const valid = states.filter(s => s.i && !states.removed);
|
||||
if (valid.length < 2) return;
|
||||
|
||||
const neibs = {"Ally":1, "Sympathy":2, "Neutral":1, "Suspicion":10, "Rival":9}; // relations to neighbors
|
||||
const neibsOfNeibs = {"Ally":10, "Sympathy":8, "Neutral":5, "Suspicion":1}; // relations to neighbors of neighbors
|
||||
const far = {"Sympathy":1, "Neutral":12, "Suspicion":2, "Unknown":6}; // relations to other
|
||||
const neibs = {"Ally":1, "Friendly":2, "Neutral":1, "Suspicion":10, "Rival":9}; // relations to neighbors
|
||||
const neibsOfNeibs = {"Ally":10, "Friendly":8, "Neutral":5, "Suspicion":1}; // relations to neighbors of neighbors
|
||||
const far = {"Friendly":1, "Neutral":12, "Suspicion":2, "Unknown":6}; // relations to other
|
||||
const navals = {"Neutral":1, "Suspicion":2, "Rival":1, "Unknown":1}; // relations of naval powers
|
||||
|
||||
valid.forEach(s => s.diplomacy = new Array(states.length).fill("x")); // clear all relationships
|
||||
|
|
|
|||
|
|
@ -14,17 +14,18 @@
|
|||
|
||||
const input = document.getElementById("templateInput");
|
||||
if (!locked("template")) {
|
||||
const rnd = Math.random();
|
||||
if (rnd < .05) input.value = "Volcano"; else // 5%
|
||||
if (rnd < .25) input.value = "High Island"; else // 20%
|
||||
if (rnd < .35) input.value = "Low Island"; else // 10%
|
||||
if (rnd < .55) input.value = "Continents"; else // 20%
|
||||
if (rnd < .85) input.value = "Archipelago"; else // 30%
|
||||
if (rnd < .90) input.value = "Mediterranean"; else // 5%
|
||||
if (rnd < .95) input.value = "Peninsula"; else // 5%
|
||||
if (rnd < .97) input.value = "Pangea"; else // 2%
|
||||
if (rnd < .99) input.value = "Isthmus"; else // 2%
|
||||
input.value = "Atoll"; // 1%
|
||||
const templates = {
|
||||
"Volcano": 5,
|
||||
"High Island": 22,
|
||||
"Low Island": 10,
|
||||
"Continents": 20,
|
||||
"Archipelago": 32,
|
||||
"Mediterranean":3,
|
||||
"Peninsula": 3,
|
||||
"Pangea": 2,
|
||||
"Isthmus": 2,
|
||||
"Atoll": 1};
|
||||
input.value = rw(templates);
|
||||
}
|
||||
|
||||
switch (input.value) {
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@
|
|||
Heresy:{"Heresy":1}
|
||||
};
|
||||
|
||||
const methods = {"Random + type":3, "Random + ism":1, "Supreme + ism":5, "Faith of + Supreme":3, "Place + ism":1, "Culture + ism":1, "Place + ian + type":6, "Culture + type":4};
|
||||
const methods = {"Random + type":3, "Random + ism":1, "Supreme + ism":5, "Faith of + Supreme":3, "Place + ism":1, "Culture + ism":2, "Place + ian + type":6, "Culture + type":4};
|
||||
|
||||
const types = {
|
||||
"Shamanism":{"Beliefs":3, "Shamanism":2, "Spirits":1},
|
||||
|
|
@ -65,7 +65,7 @@
|
|||
const form = rw(forms.Folk);
|
||||
const name = c.name + " " + rw(types[form]);
|
||||
const deity = form === "Animism" ? null : getDeityName(c.i);
|
||||
const color = `url(#hatch${rand(8,13)})`;
|
||||
const color = getRandomColor(); // `url(#hatch${rand(8,13)})`;
|
||||
religions.push({i: c.i, name, color, culture: c.i, type:"Folk", form, deity});
|
||||
});
|
||||
|
||||
|
|
@ -85,18 +85,25 @@
|
|||
const culture = cells.culture[center];
|
||||
|
||||
const deity = form === "Non-theism" ? null : getDeityName(culture);
|
||||
const [name, expansion] = getReligionName(form, deity, center);
|
||||
let [name, expansion] = getReligionName(form, deity, center);
|
||||
if (expansion === "state" && !state) expansion = "global";
|
||||
if (expansion === "culture" && !culture) expansion = "global";
|
||||
|
||||
if (expansion === "state" && Math.random() > .5) center = states[state].center;
|
||||
if (expansion === "culture" && Math.random() > .5) center = cultures[culture].center;
|
||||
|
||||
if (expansion === "state" && state && Math.random() > .5) center = states[state].center;
|
||||
if (expansion === "culture" && culture && Math.random() > .5) center = cultures[culture].center;
|
||||
if (!cells.burg[center] && cells.c[center].some(c => cells.burg[c])) center = cells.c[center].find(c => cells.burg[c]);
|
||||
const x = cells.p[center][0], y = cells.p[center][1];
|
||||
|
||||
const s = spacing * gauss(1, .3, .2, 2, 2); // randomize to make the placement not uniform
|
||||
if (religionsTree.find(x, y, s) !== undefined) continue; // to close to existing religion
|
||||
|
||||
// add "Old" to name of the folk religion on this culture
|
||||
const folk = religions.find(r => expansion === "culture" && r.culture === culture && r.type === "Folk");
|
||||
if (folk && folk.name.slice(0,3) !== "Old") folk.name = "Old " + folk.name;
|
||||
|
||||
const expansionism = rand(3, 8);
|
||||
const color = `url(#hatch${rand(0,5)})`;
|
||||
const color = getRandomColor(); // `url(#hatch${rand(0,5)})`;
|
||||
religions.push({i: religions.length, name, color, culture, type:"Organized", form, deity, expansion, expansionism, center});
|
||||
religionsTree.add([x, y]);
|
||||
//debug.append("circle").attr("cx", x).attr("cy", y).attr("r", 2).attr("fill", "blue");
|
||||
|
|
@ -116,7 +123,8 @@
|
|||
const deity = getDeityName(culture);
|
||||
const name = getCultName(form, center);
|
||||
const expansionism = gauss(1.1, .5, 0, 5);
|
||||
religions.push({i: religions.length, name, color: "url(#hatch7)", culture, type:"Cult", form, deity, expansion:"global", expansionism, center});
|
||||
const color = getRandomColor(); // "url(#hatch7)";
|
||||
religions.push({i: religions.length, name, color, culture, type:"Cult", form, deity, expansion:"global", expansionism, center});
|
||||
religionsTree.add([x, y]);
|
||||
//debug.append("circle").attr("cx", x).attr("cy", y).attr("r", 2).attr("fill", "red");
|
||||
}
|
||||
|
|
@ -137,7 +145,8 @@
|
|||
const culture = cells.culture[center];
|
||||
const name = getCultName("Heresy", center);
|
||||
const expansionism = gauss(1.2, .5, 0, 5);
|
||||
religions.push({i: religions.length, name, color:"url(#hatch6)", culture, type:"Heresy", form:"Heresy", deity: r.deity, expansion:"global", expansionism, center});
|
||||
const color = getRandomColor(); // "url(#hatch6)";
|
||||
religions.push({i: religions.length, name, color, culture, type:"Heresy", form:"Heresy", deity: r.deity, expansion:"global", expansionism, center});
|
||||
religionsTree.add([x, y]);
|
||||
//debug.append("circle").attr("cx", x).attr("cy", y).attr("r", 2).attr("fill", "green");
|
||||
}
|
||||
|
|
@ -175,34 +184,37 @@
|
|||
|
||||
religions.filter(r => r.type === "Organized" || r.type === "Cult").forEach(r => {
|
||||
cells.religion[r.center] = r.i;
|
||||
queue.queue({e:r.center, p:0, r:r.i});
|
||||
queue.queue({e:r.center, p:0, r:r.i, s: cells.state[r.center], c:r.culture});
|
||||
cost[r.center] = 1;
|
||||
});
|
||||
|
||||
const neutral = cells.i.length / 5000 * 200 * gauss(1, .3, .2, 2, 2) * neutralInput.value; // limit cost for organized religions growth
|
||||
const popCost = d3.max(cells.pop) / 3; // enougth population to spered religion without penalty
|
||||
|
||||
while (queue.length) {
|
||||
const next = queue.dequeue(), n = next.e, p = next.p, r = next.r;
|
||||
const next = queue.dequeue(), n = next.e, p = next.p, r = next.r, c = next.c, s = next.s;
|
||||
const expansion = religions[r].expansion;
|
||||
|
||||
cells.c[n].forEach(function(e) {
|
||||
const cultureCost = expansion === "culture" ? religions[r].culture == cells.culture[e] ? 0 : 20000 : 10;
|
||||
const stateCost = expansion === "state" ? cells.state[religions[r].center] == cells.state[e] ? 0 : 20000 : 10;
|
||||
const biomeCost = cells.road[e] ? 0 : biomesData.cost[cells.biome[e]];
|
||||
if (expansion === "culture" && c !== cells.culture[e]) return;
|
||||
if (expansion === "state" && s !== cells.state[e]) return;
|
||||
|
||||
const cultureCost = c !== cells.culture[e] ? 10 : 0;
|
||||
const stateCost = s !== cells.state[e] ? 10 : 0;
|
||||
const biomeCost = cells.road[e] ? 1 : biomesData.cost[cells.biome[e]];
|
||||
const populationCost = Math.max(rn(popCost - cells.pop[e]), 0);
|
||||
const heightCost = Math.max(cells.h[e], 20) - 20;
|
||||
const waterCost = cells.h[e] < 20 ? cells.road[e] ? 50 : 1000 : 0;
|
||||
const totalCost = p + (cultureCost + stateCost + biomeCost + heightCost + waterCost) / religions[r].expansionism;
|
||||
|
||||
const totalCost = p + (cultureCost + stateCost + biomeCost + populationCost + heightCost + waterCost) / religions[r].expansionism;
|
||||
if (totalCost > neutral) return;
|
||||
|
||||
if (!cost[e] || totalCost < cost[e]) {
|
||||
if (cells.h[e] >= 20 && cells.culture[e]) cells.religion[e] = r; // assign religion to cell
|
||||
cost[e] = totalCost;
|
||||
queue.queue({e, p:totalCost, r});
|
||||
queue.queue({e, p:totalCost, r, c, s});
|
||||
}
|
||||
});
|
||||
}
|
||||
//debug.selectAll(".text").data(cost).enter().append("text").attr("x", (d, e) => cells.p[e][0]-1).attr("y", (d, e) => cells.p[e][1]-1).text(d => d ? rn(d) : "").attr("font-size", 2);
|
||||
console.timeEnd("expandReligions");
|
||||
}
|
||||
|
||||
|
|
@ -288,7 +300,7 @@
|
|||
if (m === "Random + ism") return [trimVowels(random()) + "ism", "global"];
|
||||
if (m === "Supreme + ism" && deity) return [trimVowels(supreme()) + "ism", "global"];
|
||||
if (m === "Faith of + Supreme" && deity) return ["Faith of " + supreme(), "global"];
|
||||
if (m === "Place + ism") return [place() + "ism", "global"];
|
||||
if (m === "Place + ism") return [place() + "ism", "state"];
|
||||
if (m === "Culture + ism") return [trimVowels(culture()) + "ism", "culture"];
|
||||
if (m === "Place + ian + type") return [place("adj") + " " + type(), "state"];
|
||||
if (m === "Culture + type") return [culture() + " " + type(), "culture"];
|
||||
|
|
|
|||
|
|
@ -540,7 +540,7 @@ function parseLoadedData(data) {
|
|||
|
||||
if (version < 1) {
|
||||
// 1.0 adds a new religions layer
|
||||
relig = viewbox.insert("g", "#terrain").attr("id", "cults");
|
||||
relig = viewbox.insert("g", "#terrain").attr("id", "relig");
|
||||
Religions.generate();
|
||||
|
||||
// 1.0 adds a legend box
|
||||
|
|
@ -601,6 +601,16 @@ function parseLoadedData(data) {
|
|||
biomesData.color.push("#0b9131");
|
||||
biomesData.habitability.push(12);
|
||||
}
|
||||
|
||||
if (version == 1) {
|
||||
// v 1.0 initial code had a bug with religion layer id
|
||||
if (!relig.size()) relig = viewbox.insert("g", "#terrain").attr("id", "relig");
|
||||
|
||||
// v 1.0 initially has Sympathy status then relaced with Friendly
|
||||
for (const s of pack.states) {
|
||||
s.diplomacy = s.diplomacy.map(r => r === "Sympathy" ? "Friendly" : r);
|
||||
}
|
||||
}
|
||||
}()
|
||||
|
||||
changeMapSize();
|
||||
|
|
|
|||
|
|
@ -114,7 +114,7 @@ function editBiomes() {
|
|||
|
||||
if (body.dataset.type === "percentage") {body.dataset.type = "absolute"; togglePercentageMode();}
|
||||
applySorting(biomesHeader);
|
||||
$("#biomesEditor").dialog();
|
||||
$("#biomesEditor").dialog({width: fitContent()});
|
||||
}
|
||||
|
||||
function biomeHighlightOn(event) {
|
||||
|
|
|
|||
|
|
@ -129,7 +129,7 @@ function editCultures() {
|
|||
|
||||
if (body.dataset.type === "percentage") {body.dataset.type = "absolute"; togglePercentageMode();}
|
||||
applySorting(culturesHeader);
|
||||
$("#culturesEditor").dialog();
|
||||
$("#culturesEditor").dialog({width: fitContent()});
|
||||
}
|
||||
|
||||
function getTypeOptions(type) {
|
||||
|
|
|
|||
|
|
@ -15,11 +15,11 @@ function editDiplomacy() {
|
|||
if (layerIsOn("toggleReligions")) toggleReligions();
|
||||
|
||||
const body = document.getElementById("diplomacyBodySection");
|
||||
const statuses = ["Ally", "Sympathy", "Neutral", "Suspicion", "Enemy", "Unknown", "Rival", "Vassal", "Suzerain"];
|
||||
const statuses = ["Ally", "Friendly", "Neutral", "Suspicion", "Enemy", "Unknown", "Rival", "Vassal", "Suzerain"];
|
||||
const colors = ["#00b300", "#d4f8aa", "#edeee8", "#f3c7c4", "#e64b40", "#a9a9a9", "#ad5a1f", "#87CEFA", "#00008B"];
|
||||
refreshDiplomacyEditor();
|
||||
|
||||
tip("Click on a state to see its diplomatical relations", false, "warning");
|
||||
tip("Click on a state to see its diplomatic relations", false, "warning");
|
||||
viewbox.style("cursor", "crosshair").on("click", selectStateOnMapClick);
|
||||
|
||||
if (modules.editDiplomacy) return;
|
||||
|
|
@ -213,11 +213,7 @@ function editDiplomacy() {
|
|||
message += `<tr><th>${s.name}</th>` + s.diplomacy.filter((v, i) => valid.includes(i)).map(r => `<td class='${r}'>${r}</td>`).join("") + "</tr>";
|
||||
});
|
||||
message += `</table>`;
|
||||
console.log(alertMessage.innerHTML)
|
||||
console.log(message)
|
||||
alertMessage.innerHTML = message;
|
||||
console.log(alertMessage.innerHTML)
|
||||
|
||||
$("#alert").dialog({title: "Relations matrix", width: fitContent(), position: {my: "center", at: "center", of: "svg"}, buttons: {}});
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -252,9 +252,13 @@ function clearLegend() {
|
|||
|
||||
// draw color (fill) picker
|
||||
function createPicker() {
|
||||
const pos = () => tip("Drag to change the picker position");
|
||||
const cl = () => tip("Click to close the picker");
|
||||
const closePicker = () => contaiter.style("display", "none");
|
||||
|
||||
const contaiter = d3.select("body").append("svg").attr("id", "pickerContainer").attr("width", "100%").attr("height", "100%");
|
||||
const curtain = contaiter.append("rect").attr("x", 0).attr("y", 0).attr("width", "100%").attr("height", "100%").attr("opacity", .2);
|
||||
curtain.on("click", () => contaiter.style("display", "none")).on("mousemove", () => tip("Click to close the picker"));
|
||||
contaiter.append("rect").attr("x", 0).attr("y", 0).attr("width", "100%").attr("height", "100%").attr("opacity", .2)
|
||||
.on("mousemove", cl).on("click", closePicker);
|
||||
const picker = contaiter.append("g").attr("id", "picker").call(d3.drag().on("start", dragPicker));
|
||||
|
||||
const controls = picker.append("g").attr("id", "pickerControls");
|
||||
|
|
@ -279,6 +283,24 @@ function createPicker() {
|
|||
controls.selectAll("line").on("click", clickPickerControl);
|
||||
controls.selectAll("circle").call(d3.drag().on("start", dragPickerControl));
|
||||
|
||||
const spaces = picker.append("foreignObject").attr("id", "pickerSpaces")
|
||||
.attr("x", 4).attr("y", 20).attr("width", 303).attr("height", 20)
|
||||
.on("mousemove", () => tip("Color value in different color spaces. Edit to change"));
|
||||
const html = `
|
||||
<label style="margin-right: 6px">HSL:
|
||||
<input type="number" id="pickerHSL_H" data-space="hsl" min=0 max=360 value="231">,
|
||||
<input type="number" id="pickerHSL_S" data-space="hsl" min=0 max=100 value="70">,
|
||||
<input type="number" id="pickerHSL_L" data-space="hsl" min=0 max=100 value="70">
|
||||
</label>
|
||||
<label style="margin-right: 6px">RGB:
|
||||
<input type="number" id="pickerRGB_R" data-space="rgb" min=0 max=255 value="125">,
|
||||
<input type="number" id="pickerRGB_G" data-space="rgb" min=0 max=255 value="142">,
|
||||
<input type="number" id="pickerRGB_B" data-space="rgb" min=0 max=255 value="232">
|
||||
</label>
|
||||
<label>HEX: <input type="text" id="pickerHEX" data-space="hex" style="width:42px" autocorrect="off" spellcheck="false" value="#7d8ee8"></label>`;
|
||||
spaces.node().insertAdjacentHTML('beforeend', html);
|
||||
spaces.selectAll("input").on("change", changePickerSpace);
|
||||
|
||||
const colors = picker.append("g").attr("id", "pickerColors").attr("stroke", "#333333");
|
||||
const hatches = picker.append("g").attr("id", "pickerHatches").attr("stroke", "#333333");
|
||||
const hatching = d3.selectAll("g#hatching > pattern");
|
||||
|
|
@ -287,12 +309,12 @@ function createPicker() {
|
|||
const clr = d3.range(number).map(i => d3.hsl(i/number*360, .7, .7).hex());
|
||||
clr.forEach(function(d, i) {
|
||||
colors.append("rect").attr("id", "picker_" + d).attr("fill", d).attr("class", i?"":"selected")
|
||||
.attr("x", i*22+4).attr("y", 20).attr("width", 16).attr("height", 16);
|
||||
.attr("x", i*22+4).attr("y", 40).attr("width", 16).attr("height", 16);
|
||||
});
|
||||
|
||||
hatching.each(function(d, i) {
|
||||
hatches.append("rect").attr("id", "picker_" + this.id).attr("fill", "url(#" + this.id + ")")
|
||||
.attr("x", i*22+4).attr("y", 41).attr("width", 16).attr("height", 16);
|
||||
.attr("x", i*22+4).attr("y", 61).attr("width", 16).attr("height", 16);
|
||||
});
|
||||
|
||||
colors.selectAll("rect").on("click", pickerFillClicked).on("mousemove", () => tip("Click to fill with the color"));
|
||||
|
|
@ -302,8 +324,10 @@ function createPicker() {
|
|||
const bbox = picker.node().getBBox();
|
||||
const width = bbox.width + 8;
|
||||
const height = bbox.height + 9;
|
||||
const pos = () => tip("Drag to change the picker position");
|
||||
picker.insert("rect", ":first-child").attr("x", 0).attr("y", 0).attr("width", width).attr("height", height).attr("fill", "#ffffff").on("mousemove", pos);
|
||||
|
||||
picker.insert("rect", ":first-child").attr("x", 0).attr("y", 0).attr("width", width).attr("height", height).attr("fill", "#ffffff").attr("stroke", "#5d4651").on("mousemove", pos);
|
||||
picker.insert("text", ":first-child").attr("x", 291).attr("y", -11).attr("id", "pickerCloseText").text("✖");
|
||||
picker.insert("rect", ":first-child").attr("x", 288).attr("y", -21).attr("id", "pickerCloseRect").attr("width", 14).attr("height", 14).on("mousemove", cl).on("click", closePicker);
|
||||
picker.insert("text", ":first-child").attr("x", 12).attr("y", -10).attr("id", "pickerLabel").text("Color Picker").on("mousemove", pos);
|
||||
picker.insert("rect", ":first-child").attr("x", 0).attr("y", -30).attr("width", width).attr("height", 30).attr("id", "pickerHeader").on("mousemove", pos);
|
||||
picker.attr("transform", `translate(${(svgWidth-width)/2},${(svgHeight-height)/2})`);
|
||||
|
|
@ -314,6 +338,25 @@ function updateSelectedRect(fill) {
|
|||
document.getElementById("picker").querySelector("rect[fill='"+fill+"']").classList.add("selected");
|
||||
}
|
||||
|
||||
function updateSpaces() {
|
||||
// hsl
|
||||
const h = getPickerControl(pickerH, 360);
|
||||
const s = getPickerControl(pickerS, 1);
|
||||
const l = getPickerControl(pickerL, 1);
|
||||
pickerHSL_H.value = rn(h);
|
||||
pickerHSL_S.value = rn(s * 100); // multiplied by 100
|
||||
pickerHSL_L.value = rn(l * 100); // multiplied by 100
|
||||
|
||||
// rgb
|
||||
const rgb = d3.color(d3.hsl(h, s, l));
|
||||
pickerRGB_R.value = rgb.r;
|
||||
pickerRGB_G.value = rgb.g;
|
||||
pickerRGB_B.value = rgb.b;
|
||||
|
||||
// hex
|
||||
pickerHEX.value = rgb.hex();
|
||||
}
|
||||
|
||||
function updatePickerColors() {
|
||||
const colors = d3.select("#picker > #pickerColors").selectAll("rect");
|
||||
const number = colors.size();
|
||||
|
|
@ -339,6 +382,7 @@ function openPicker(fill, callback) {
|
|||
if (!isNaN(hsl.h)) setPickerControl(pickerH, hsl.h, 360);
|
||||
if (!isNaN(hsl.s)) setPickerControl(pickerS, hsl.s, 1);
|
||||
if (!isNaN(hsl.l)) setPickerControl(pickerL, hsl.l, 1);
|
||||
updateSpaces();
|
||||
updatePickerColors();
|
||||
}
|
||||
|
||||
|
|
@ -380,13 +424,20 @@ function dragPicker() {
|
|||
}
|
||||
|
||||
function pickerFillClicked() {
|
||||
updateSelectedRect(this.getAttribute("fill"));
|
||||
const fill = this.getAttribute("fill");
|
||||
updateSelectedRect(fill);
|
||||
openPicker.updateFill();
|
||||
|
||||
const hsl = d3.hsl(fill);
|
||||
if (isNaN(hsl.h)) return; // not a color
|
||||
setPickerControl(pickerH, hsl.h, 360);
|
||||
updateSpaces();
|
||||
}
|
||||
|
||||
function clickPickerControl() {
|
||||
const min = this.getScreenCTM().e;
|
||||
this.nextSibling.setAttribute("cx", d3.event.x - min);
|
||||
updateSpaces();
|
||||
updatePickerColors();
|
||||
openPicker.updateFill();
|
||||
}
|
||||
|
|
@ -398,11 +449,33 @@ function dragPickerControl() {
|
|||
d3.event.on("drag", function() {
|
||||
const x = Math.max(Math.min(d3.event.x, max), min);
|
||||
this.setAttribute("cx", x);
|
||||
updateSpaces();
|
||||
updatePickerColors();
|
||||
openPicker.updateFill();
|
||||
});
|
||||
}
|
||||
|
||||
function changePickerSpace() {
|
||||
const valid = this.checkValidity();
|
||||
if (!valid) {tip("You must provide a correct value", false, "error"); return;}
|
||||
|
||||
const space = this.dataset.space;
|
||||
const i = Array.from(this.parentNode.querySelectorAll("input")).map(input => input.value); // inputs
|
||||
const fill = space === "hex" ? d3.rgb(this.value)
|
||||
: space === "rgb" ? d3.rgb(i[0], i[1], i[2])
|
||||
: d3.hsl(i[0], i[1]/100, i[2]/100);
|
||||
|
||||
const hsl = d3.hsl(fill);
|
||||
if (isNaN(hsl.l)) {tip("You must provide a correct value", false, "error"); return;}
|
||||
if (!isNaN(hsl.h)) setPickerControl(pickerH, hsl.h, 360);
|
||||
if (!isNaN(hsl.s)) setPickerControl(pickerS, hsl.s, 1);
|
||||
if (!isNaN(hsl.l)) setPickerControl(pickerL, hsl.l, 1);
|
||||
|
||||
updateSpaces();
|
||||
updatePickerColors();
|
||||
openPicker.updateFill();
|
||||
}
|
||||
|
||||
// remove all fogging
|
||||
function unfog() {
|
||||
defs.select("#fog").selectAll("path").remove();
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@ function moved() {
|
|||
if (i === undefined) return;
|
||||
showNotes(d3.event, i);
|
||||
const g = findGridCell(point[0], point[1]); // grid cell id
|
||||
if (tooltip.dataset.main) showMainTip(); else showMapTooltip(d3.event, i, g);
|
||||
if (tooltip.dataset.main) showMainTip(); else showMapTooltip(point, d3.event, i, g);
|
||||
if (toolsContent.style.display === "block" && cellInfo.style.display === "block") updateCellInfo(point, i, g);
|
||||
}
|
||||
|
||||
|
|
@ -71,7 +71,7 @@ function showNotes(e, i) {
|
|||
}
|
||||
|
||||
// show viewbox tooltip if main tooltip is blank
|
||||
function showMapTooltip(e, i, g) {
|
||||
function showMapTooltip(point, e, i, g) {
|
||||
tip(""); // clear tip
|
||||
const tag = e.target.tagName;
|
||||
const path = e.composedPath ? e.composedPath() : getComposedPath(e.target); // apply polyfill
|
||||
|
|
@ -116,7 +116,7 @@ function showMapTooltip(e, i, g) {
|
|||
tip(prov + state);
|
||||
} else
|
||||
if (layerIsOn("toggleCultures") && pack.cells.culture[i]) tip("Culture: " + pack.cultures[pack.cells.culture[i]].name); else
|
||||
if (layerIsOn("toggleHeight")) tip("Height: " + getFriendlyHeight(pack.cells.h[i]));
|
||||
if (layerIsOn("toggleHeight")) tip("Height: " + getFriendlyHeight(point));
|
||||
}
|
||||
|
||||
// get cell info on mouse move
|
||||
|
|
@ -127,7 +127,8 @@ function updateCellInfo(point, i, g) {
|
|||
infoCell.innerHTML = i;
|
||||
const unit = areaUnit.value === "square" ? " " + distanceUnitInput.value + "²" : " " + areaUnit.value;
|
||||
infoArea.innerHTML = cells.area[i] ? si(cells.area[i] * distanceScaleInput.value ** 2) + unit : "n/a";
|
||||
infoHeight.innerHTML = getFriendlyHeight(cells.h[i]) + " (" + cells.h[i] + ")";
|
||||
const h = pack.cells.h[i] < 20 ? grid.cells.h[pack.cells.g[i]] : pack.cells.h[i];
|
||||
infoHeight.innerHTML = getFriendlyHeight(point) + " (" + h + ")";
|
||||
infoTemp.innerHTML = convertTemperature(grid.cells.temp[g]);
|
||||
infoPrec.innerHTML = cells.h[i] >= 20 ? getFriendlyPrecipitation(i) : "n/a";
|
||||
infoState.innerHTML = cells.h[i] >= 20 ? cells.state[i] ? `${pack.states[cells.state[i]].fullName} (${cells.state[i]})` : "neutral lands (0)" : "no";
|
||||
|
|
@ -142,12 +143,16 @@ function updateCellInfo(point, i, g) {
|
|||
}
|
||||
|
||||
// get user-friendly (real-world) height value from map data
|
||||
function getFriendlyHeight(h) {
|
||||
function getFriendlyHeight(p) {
|
||||
const unit = heightUnit.value;
|
||||
let unitRatio = 3.281; // default calculations are in feet
|
||||
if (unit === "m") unitRatio = 1; // if meter
|
||||
else if (unit === "f") unitRatio = 0.5468; // if fathom
|
||||
|
||||
const packH = pack.cells.h[findCell(p[0], p[1])];
|
||||
const gridH = grid.cells.h[findGridCell(p[0], p[1])];
|
||||
const h = packH < 20 ? gridH : packH;
|
||||
|
||||
let height = -990;
|
||||
if (h >= 20) height = Math.pow(h - 18, +heightExponentInput.value);
|
||||
else if (h < 20 && h > 0) height = (h - 20) / h * 50;
|
||||
|
|
|
|||
|
|
@ -82,9 +82,8 @@ function editHeightmap() {
|
|||
heightmapInfoX.innerHTML = rn(p[0]);
|
||||
heightmapInfoY.innerHTML = rn(p[1]);
|
||||
heightmapInfoCell.innerHTML = cell;
|
||||
heightmapInfoHeight.innerHTML = grid.cells.h[cell];
|
||||
|
||||
tip("Height: " + getFriendlyHeight(grid.cells.h[cell]));
|
||||
heightmapInfoHeight.innerHTML = `${grid.cells.h[cell]} (${getHeight(grid.cells.h[cell])})`;
|
||||
if (tooltip.dataset.main) showMainTip();
|
||||
|
||||
// move radius circle if drag mode is active
|
||||
const pressed = document.querySelector("#brushesButtons > button.pressed");
|
||||
|
|
@ -92,6 +91,20 @@ function editHeightmap() {
|
|||
moveCircle(p[0], p[1], brushRadius.valueAsNumber, "#333");
|
||||
}
|
||||
|
||||
// get user-friendly (real-world) height value from map data
|
||||
function getHeight(h) {
|
||||
const unit = heightUnit.value;
|
||||
let unitRatio = 3.281; // default calculations are in feet
|
||||
if (unit === "m") unitRatio = 1; // if meter
|
||||
else if (unit === "f") unitRatio = 0.5468; // if fathom
|
||||
|
||||
let height = -990;
|
||||
if (h >= 20) height = Math.pow(h - 18, +heightExponentInput.value);
|
||||
else if (h < 20 && h > 0) height = (h - 20) / h * 50;
|
||||
|
||||
return rn(height * unitRatio) + " " + unit;
|
||||
}
|
||||
|
||||
// Exit customization mode
|
||||
function finalizeHeightmap() {
|
||||
if (terrs.selectAll("*").size() < 200) {
|
||||
|
|
@ -218,6 +231,14 @@ function editHeightmap() {
|
|||
if (grid.cells.h[i] < 20) grid.cells.h[i] = 20;
|
||||
}
|
||||
|
||||
// save culture centers x and y to restore center cell id after re-graph
|
||||
for (const c of pack.cultures) {
|
||||
if (!c.i || c.removed) continue;
|
||||
const p = pack.cells.p[c.center];
|
||||
c.x = p[0];
|
||||
c.y = p[1];
|
||||
}
|
||||
|
||||
markFeatures();
|
||||
OceanLayers();
|
||||
calculateTemperatures();
|
||||
|
|
@ -299,6 +320,11 @@ function editHeightmap() {
|
|||
else {p.center = provCells[0]; p.burg = pack.cells.burg[p.center];}
|
||||
}
|
||||
|
||||
for (const c of pack.cultures) {
|
||||
if (!c.i || c.removed) continue;
|
||||
c.center = findCell(c.x, c.y);
|
||||
}
|
||||
|
||||
BurgsAndStates.drawStateLabels();
|
||||
drawStates();
|
||||
drawBorders();
|
||||
|
|
@ -883,7 +909,12 @@ function editHeightmap() {
|
|||
setOverlayOpacity(0);
|
||||
|
||||
document.getElementById("convertImageLoad").classList.add("glow"); // add glow effect
|
||||
tip('Image Converter is opened. Upload the image and assign the colors to desired heights', true); // main tip
|
||||
tip('Image Converter is opened. Upload the image and assign the colors to desired heights', true, "warn"); // main tip
|
||||
|
||||
// remove all heights
|
||||
grid.cells.h = new Uint8Array(grid.cells.i.length);
|
||||
terrs.selectAll("*").remove();
|
||||
updateHistory();
|
||||
|
||||
if (modules.openImageConverter) return;
|
||||
modules.openImageConverter = true;
|
||||
|
|
@ -944,8 +975,8 @@ function editHeightmap() {
|
|||
colorsUnassigned.style.display = "block";
|
||||
colorsAssigned.style.display = "none";
|
||||
|
||||
const gridColors = grid.points.map(function(p) {
|
||||
const x = Math.floor(p[0]), y = Math.floor(p[1]);
|
||||
const gridColors = grid.points.map(p => {
|
||||
const x = Math.floor(p[0]-.01), y = Math.floor(p[1]-.01);
|
||||
const i = (x + y * graphWidth) * 4;
|
||||
const r = data[i], g = data[i+1], b = data[i+2];
|
||||
return [r, g, b];
|
||||
|
|
@ -961,7 +992,7 @@ function editHeightmap() {
|
|||
return clr;
|
||||
}).on("click", mapClicked);
|
||||
|
||||
const unassigned = [...usedColors].sort((a, b) => d3.lab(a).b - d3.lab(b).b);
|
||||
const unassigned = [...usedColors].sort((a, b) => d3.lab(a).l - d3.lab(b).l);
|
||||
const unassignedContainer = d3.select("#colorsUnassigned");
|
||||
unassignedContainer.selectAll("div").data(unassigned).enter().append("div")
|
||||
.attr("data-color", i => i).style("background-color", i => i)
|
||||
|
|
@ -1002,7 +1033,7 @@ function editHeightmap() {
|
|||
const height = +this.getAttribute("data-color");
|
||||
const rgb = color(1 - height/100);
|
||||
|
||||
const selectedColor = imageConverter.querySelector("div.selectedColor");
|
||||
const selectedColor = imageConverter.querySelector("div.selectedColor");
|
||||
selectedColor.style.backgroundColor = rgb;
|
||||
selectedColor.setAttribute("data-color", rgb);
|
||||
selectedColor.setAttribute("data-height", height);
|
||||
|
|
@ -1027,19 +1058,19 @@ function editHeightmap() {
|
|||
unassigned.forEach(function(el) {
|
||||
const colorFrom = el.getAttribute("data-color");
|
||||
const lab = d3.lab(colorFrom);
|
||||
const normalized = type === "hue" ? rn(normalize(lab.b + lab.a / 2, -50, 200), 2) : rn(normalize(lab.l, 0, 100), 2);
|
||||
const normalized = type === "hue" ? rn(normalize(lab.b + lab.a / 2, -50, 200), 2) : rn(normalize(lab.l, -15, 100), 2);
|
||||
const colorTo = color(1 - normalized);
|
||||
const heightTo = normalized * 100;
|
||||
|
||||
|
||||
terrs.selectAll("polygon[fill='" + colorFrom + "']").attr("fill", colorTo).attr("data-height", heightTo);
|
||||
el.style.backgroundColor = colorTo;
|
||||
el.setAttribute("data-color", colorTo);
|
||||
el.setAttribute("data-height", heightTo);
|
||||
colorsAssigned.appendChild(el);
|
||||
colorsAssigned.appendChild(el);
|
||||
});
|
||||
|
||||
colorsAssigned.style.display = "block";
|
||||
colorsUnassigned.style.display = "none";
|
||||
colorsUnassigned.style.display = "none";
|
||||
}
|
||||
|
||||
function changeConvertColorsNumber(change) {
|
||||
|
|
|
|||
|
|
@ -183,33 +183,49 @@ function editMarker() {
|
|||
["1F4B0", "💰", "Money bag"],
|
||||
["1F6A8", "🚨", "Revolving Light"],
|
||||
["1F309", "🌉", "Bridge at Night"],
|
||||
["1F4A8", "💨", "Dashing away"],
|
||||
["1F334", "🌴", "Palm"],
|
||||
["1F335", "🌵", "Cactus"],
|
||||
["1F33E", "🌾", "Sheaf"],
|
||||
["1F5FB", "🗻", "Mountain"],
|
||||
["1F30B", "🌋", "Volcano"],
|
||||
["270A", "✊", "Raised Fist"],
|
||||
["1F44A", "👊", "Oncoming Fist"],
|
||||
["1F4AA", "💪", "Flexed Biceps"],
|
||||
["1F47C", "👼", "Baby Angel"],
|
||||
["1F40E", "🐎", "Horse"],
|
||||
["1F434", "🐴", "Horse Face"],
|
||||
["1F42E", "🐮", "Cow"],
|
||||
["1F43A", "🐺", "Wolf Face"],
|
||||
["1F435", "🐵", "Monkey face"],
|
||||
["1F437", "🐷", "Pig face"],
|
||||
["1F414", "🐔", "Chiken"],
|
||||
["1F411", "🐑", "Eve"],
|
||||
["1F414", "🐔", "Chicken"],
|
||||
["1F411", "🐑", "Ewe"],
|
||||
["1F42B", "🐫", "Camel"],
|
||||
["1F418", "🐘", "Elephant"],
|
||||
["1F422", "🐢", "Turtle"],
|
||||
["1F40C", "🐌", "Snail"],
|
||||
["1F40D", "🐍", "Snake"],
|
||||
["1F41D", "🐝", "Honeybee"],
|
||||
["1F41C", "🐜", "Ant"],
|
||||
["1F41B", "🐛", "Bug"],
|
||||
["1F426", "🐦", "Bird"],
|
||||
["1F438", "🐸", "Frog Face"],
|
||||
["1F433", "🐳", "Whale"],
|
||||
["1F42C", "🐬", "Dolphin"],
|
||||
["1F420", "🐟", "Fish"],
|
||||
["1F480", "💀", "Skull"],
|
||||
["1F432", "🐲", "Dragon Head"],
|
||||
["1F479", "👹", "Ogre"],
|
||||
["1F47A", "👺", "Goblin"],
|
||||
["1F47B", "👻", "Ghost"],
|
||||
["1F47E", "👾", "Alien"],
|
||||
["1F480", "💀", "Skull"],
|
||||
["1F383", "🎃", "Jack-O-Lantern"],
|
||||
["1F384", "🎄", "Christmas Tree"],
|
||||
["1F334", "🌴", "Palm"],
|
||||
["1F335", "🌵", "Cactus"],
|
||||
["2618", "☘️", "Shamrock"],
|
||||
["1F340", "🍀", "Four Leaf Clover"],
|
||||
["1F341", "🍁", "Maple Leaf"],
|
||||
["1F33F", "🌿", "Herb"],
|
||||
["1F33E", "🌾", "Sheaf"],
|
||||
["1F344", "🍄", "Mushroom"],
|
||||
["1F374", "🍴", "Fork and knife"],
|
||||
["1F372", "🍲", "Food"],
|
||||
["1F35E", "🍞", "Bread"],
|
||||
|
|
@ -223,24 +239,37 @@ function editMarker() {
|
|||
["1F377", "🍷", "Wine glass"],
|
||||
["1F3BB", "🎻", "Violin"],
|
||||
["1F3B8", "🎸", "Guitar"],
|
||||
["1F52A", "🔪", "Knife"],
|
||||
["1F52B", "🔫", "Pistol"],
|
||||
["1F4A3", "💣", "Bomb"],
|
||||
["1F4A5", "💥", "Collision"],
|
||||
["1F4A8", "💨", "Dashing away"],
|
||||
["1F301", "🌁", "Foggy"],
|
||||
["2744", "❄️", "Snowflake"],
|
||||
["26A1", "⚡", "Electricity"],
|
||||
["1F320", "🌠", "Shooting star"],
|
||||
["1F319", "🌙", "Crescent moon"],
|
||||
["1F525", "🔥", "Fire"],
|
||||
["1F4A7", "💧", "Droplet"],
|
||||
["1F30A", "🌊", "Wave"],
|
||||
["23F0", "⏰", "Alarm Clock"],
|
||||
["231B", "⌛", "Hourglass"],
|
||||
["1F3C6", "🏆", "Goblet"],
|
||||
["26F2", "⛲", "Fountain"],
|
||||
["26F5", "⛵", "Sailboat"],
|
||||
["26FA", "⛺", "Tend"],
|
||||
["26FA", "⛺", "Campfire"],
|
||||
["2764", "❤", "Red Heart"],
|
||||
["1F498", "💘", "Heart With Arrow"],
|
||||
["1F489", "💉", "Syringe"],
|
||||
["1F4D5", "📕", "Closed Book"],
|
||||
["1F4D6", "📚", "Books"],
|
||||
["1F381", "🎁", "Wrapped Gift"],
|
||||
["1F3AF", "🎯", "Archery"],
|
||||
["1F52E", "🔮", "Magic ball"],
|
||||
["1F3AD", "🎭", "Performing arts"],
|
||||
["1F3A8", "🎨", "Artist palette"],
|
||||
["1F457", "👗", "Dress"],
|
||||
["1F392", "🎒", "Backpack"],
|
||||
["1F451", "👑", "Crown"],
|
||||
["1F48D", "💍", "Ring"],
|
||||
["1F48E", "💎", "Gem"],
|
||||
|
|
@ -259,7 +288,6 @@ function editMarker() {
|
|||
["21F6", "⇶", "Three arrows"],
|
||||
["2699", "⚙", "Gear"],
|
||||
["269B", "⚛", "Atom"],
|
||||
["0024", "$", "Dollar"],
|
||||
["2680", "⚀", "Die1"],
|
||||
["2681", "⚁", "Die2"],
|
||||
["2682", "⚂", "Die3"],
|
||||
|
|
|
|||
|
|
@ -873,13 +873,13 @@ function randomizeOptions() {
|
|||
if (!locked("regions")) regionsInput.value = regionsOutput.value = gauss(15, 3, 2, 30);
|
||||
if (!locked("provinces")) provincesInput.value = provincesOutput.value = gauss(40, 20, 20, 100);
|
||||
if (!locked("manors")) {manorsInput.value = 1000; manorsOutput.value = "auto";}
|
||||
if (!locked("religions")) religionsInput.value = religionsOutput.value = gauss(6, 2, 3, 20);
|
||||
if (!locked("religions")) religionsInput.value = religionsOutput.value = gauss(5, 2, 2, 10);
|
||||
if (!locked("power")) powerInput.value = powerOutput.value = gauss(3, 2, 0, 10);
|
||||
if (!locked("neutral")) neutralInput.value = neutralOutput.value = rn(1 + Math.random(), 1);
|
||||
if (!locked("cultures")) culturesInput.value = culturesOutput.value = gauss(12, 3, 5, 30);
|
||||
|
||||
// 'Configure World' settings
|
||||
if (!locked("prec")) precInput.value = precOutput.value = gauss(100, 40, 0, 500);
|
||||
if (!locked("prec")) precInput.value = precOutput.value = gauss(100, 20, 5, 500);
|
||||
const tMax = +temperatureEquatorOutput.max, tMin = +temperatureEquatorOutput.min; // temperature extremes
|
||||
if (!locked("temperatureEquator")) temperatureEquatorOutput.value = temperatureEquatorInput.value = rand(tMax-6, tMax);
|
||||
if (!locked("temperaturePole")) temperaturePoleOutput.value = temperaturePoleInput.value = rand(tMin, tMin+10);
|
||||
|
|
|
|||
|
|
@ -25,6 +25,7 @@ function editReligions() {
|
|||
document.getElementById("religionsEditorRefresh").addEventListener("click", refreshReligionsEditor);
|
||||
document.getElementById("religionsLegend").addEventListener("click", toggleLegend);
|
||||
document.getElementById("religionsPercentage").addEventListener("click", togglePercentageMode);
|
||||
document.getElementById("religionsExtinct").addEventListener("click", toggleExtinct);
|
||||
document.getElementById("religionsManually").addEventListener("click", enterReligionsManualAssignent);
|
||||
document.getElementById("religionsManuallyApply").addEventListener("click", applyReligionsManualAssignent);
|
||||
document.getElementById("religionsManuallyCancel").addEventListener("click", () => exitReligionsManualAssignment());
|
||||
|
|
@ -56,11 +57,13 @@ function editReligions() {
|
|||
|
||||
for (const r of pack.religions) {
|
||||
if (r.removed) continue;
|
||||
|
||||
const area = r.area * (distanceScaleInput.value ** 2);
|
||||
const rural = r.rural * populationRate.value;
|
||||
const urban = r.urban * populationRate.value * urbanization.value;
|
||||
const population = rn(rural + urban);
|
||||
const populationTip = `Total population: ${si(population)}; Rural population: ${si(rural)}; Urban population: ${si(urban)}`;
|
||||
if (r.i && !population && body.dataset.extinct !== "show") continue; // hide extinct religions
|
||||
const populationTip = `Believers: ${si(population)}; Rural areas: ${si(rural)}; Urban areas: ${si(urban)}`;
|
||||
totalArea += area;
|
||||
totalPopulation += population;
|
||||
|
||||
|
|
@ -98,7 +101,11 @@ function editReligions() {
|
|||
body.innerHTML = lines;
|
||||
|
||||
// update footer
|
||||
religionsFooterNumber.innerHTML = pack.religions.filter(r => r.i && !r.removed).length;
|
||||
const valid = pack.religions.filter(r => r.i && !r.removed);
|
||||
religionsOrganized.innerHTML = valid.filter(r => r.type === "Organized").length;
|
||||
religionsHeresies.innerHTML = valid.filter(r => r.type === "Heresy").length;
|
||||
religionsCults.innerHTML = valid.filter(r => r.type === "Cult").length;
|
||||
religionsFolk.innerHTML = valid.filter(r => r.type === "Folk").length;
|
||||
religionsFooterArea.innerHTML = si(totalArea) + unit;
|
||||
religionsFooterPopulation.innerHTML = si(totalPopulation);
|
||||
religionsFooterArea.dataset.area = totalArea;
|
||||
|
|
@ -118,7 +125,7 @@ function editReligions() {
|
|||
|
||||
if (body.dataset.type === "percentage") {body.dataset.type = "absolute"; togglePercentageMode();}
|
||||
applySorting(religionsHeader);
|
||||
$("#religionsEditor").dialog();
|
||||
$("#religionsEditor").dialog({width: fitContent()});
|
||||
}
|
||||
|
||||
function getTypeOptions(type) {
|
||||
|
|
@ -204,7 +211,7 @@ function editReligions() {
|
|||
}
|
||||
|
||||
function drawReligionCenters() {
|
||||
const tooltip = "Drag to move the religion center";
|
||||
const tooltip = "Drag to move the religion center (it won't affect religions distribution)";
|
||||
debug.select("#religionCenters").remove();
|
||||
const religionCenters = debug.append("g").attr("id", "religionCenters")
|
||||
.attr("stroke-width", 2).attr("stroke", "#444444").style("cursor", "move");
|
||||
|
|
@ -252,6 +259,11 @@ function editReligions() {
|
|||
}
|
||||
}
|
||||
|
||||
function toggleExtinct() {
|
||||
body.dataset.extinct = body.dataset.extinct !== "show" ? "show" : "hide";
|
||||
religionsEditorAddLines();
|
||||
}
|
||||
|
||||
function enterReligionsManualAssignent() {
|
||||
if (!layerIsOn("toggleReligions")) toggleReligions();
|
||||
customization = 7;
|
||||
|
|
@ -398,8 +410,8 @@ function editReligions() {
|
|||
|
||||
function downloadReligionsData() {
|
||||
const unit = areaUnit.value === "square" ? distanceUnitInput.value + "2" : areaUnit.value;
|
||||
let data = "Id,Religion,Color,Type,Form,Deity,Area "+unit+",Population\n"; // headers
|
||||
|
||||
let data = "Id,Religion,Color,Type,Form,Deity,Area "+unit+",Believers\n"; // headers
|
||||
|
||||
body.querySelectorAll(":scope > div").forEach(function(el) {
|
||||
data += el.dataset.id + ",";
|
||||
data += el.dataset.name + ",";
|
||||
|
|
|
|||
|
|
@ -151,7 +151,7 @@ function editStates() {
|
|||
|
||||
if (body.dataset.type === "percentage") {body.dataset.type = "absolute"; togglePercentageMode();}
|
||||
applySorting(statesHeader);
|
||||
$("#statesEditor").dialog();
|
||||
$("#statesEditor").dialog({width: fitContent()});
|
||||
}
|
||||
|
||||
function getCultureOptions(culture) {
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ function editZones() {
|
|||
body.querySelectorAll("div.states").forEach(el => el.addEventListener("mouseleave", ev => zoneHighlightOff(ev)));
|
||||
|
||||
if (body.dataset.type === "percentage") {body.dataset.type = "absolute"; togglePercentageMode();}
|
||||
$("#zonesEditor").dialog();
|
||||
$("#zonesEditor").dialog({width: fitContent()});
|
||||
}
|
||||
|
||||
function zoneHighlightOn(event) {
|
||||
|
|
|
|||
|
|
@ -24,13 +24,14 @@ function getBoundaryPoints(width, height, spacing) {
|
|||
// get points on a regular square grid and jitter them a bit
|
||||
function getJitteredGrid(width, height, spacing) {
|
||||
const radius = spacing / 2; // square radius
|
||||
const jittering = radius * 0.9; // max deviation
|
||||
const jitter = function() {return Math.random() * 2 * jittering - jittering;};
|
||||
const jittering = radius * .9; // max deviation
|
||||
const jitter = () => Math.random() * 2 * jittering - jittering;
|
||||
|
||||
let points = [];
|
||||
for (let y = radius; y < height; y += spacing) {
|
||||
for (let x = radius; x < width; x += spacing) {
|
||||
let xj = rn(x + jitter(), 2);
|
||||
let yj = rn(y + jitter(), 2);
|
||||
const xj = Math.min(rn(x + jitter(), 2), width);
|
||||
const yj = Math.min(rn(y + jitter(), 2), height);
|
||||
points.push([xj, yj]);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue