333/civ
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

tweak

Browse source
This commit is contained in:
33333-33333 2026-05-16 13:48:08 +09:00
commit ff89ec62fd
4 changed files with 112 additions and 75 deletions
Download patch file Download diff file Expand all files Collapse all files

34
render.js
View file

@ -290,15 +290,16 @@ els.tooltip.innerHTML = `
])}
${tooltipSection("City & State", [
tooltipRow("Population", city?.population.toLocaleString(), city),
tooltipRow("Age cap", city ? `${Math.floor(sim.cityAgePopulationLimit(city)).toLocaleString()} / ${Math.round((city.ageWear || 0) * 100)}% wear` : "", city),
tooltipRow("Food stock", city?.storedResources.toFixed(1), city),
tooltipRow("Supply stress", (city?.supplyStress || 0).toFixed(2), city),
tooltipRow("Trade", city ? `${city.tradeLinks.size} links, ${(city.tradeValue || 0).toFixed(2)} value` : "", city),
tooltipRow("Knowledge", city ? `${knowledgeLevel(city, "farming").toFixed(2)} farm / ${knowledgeLevel(city, "metallurgy").toFixed(2)} metal` : "", city),
tooltipRow("City majority", `E${cityEthnicity}`, cityEthnicity),
tooltipRow("City majority", cityEthnicity != null ? `E${cityEthnicity}` : "", cityEthnicity != null),
city ? cityEthnicityPie(city) : "",
tooltipRow("State", polity ? `#${polity.id}` : "Independent", city),
tooltipRow("Loyalty", city?.loyalty.toFixed(2), city),
tooltipRow("Charisma", clamp(polity?.charisma ?? 1, 0.5, 1.5).toFixed(2), polity),
tooltipRow("Charisma", clamp(polity?.charisma ?? 1, SimConfig.polity?.charismaMin ?? 0.5, SimConfig.polity?.charismaMax ?? 3.0).toFixed(2), polity),
tooltipRow("Leader tenure", polity ? `${Math.floor((sim.year - (polity.leaderStarted ?? polity.founded ?? sim.year)) / WEEKS_PER_YEAR)}y` : "", polity),
tooltipRow("Treasury", polity?.treasury.toFixed(1), polity),
tooltipRow("Capital", polity && city ? polity.centerCityId === city.id ? "yes" : "no" : "", polity)
@ -328,33 +329,44 @@ els.tooltip.style.left = `${clamp(left, margin, Math.max(margin, hoverState.widt
els.tooltip.style.top = `${clamp(top, margin, Math.max(margin, hoverState.height - height - margin))}px`;
}
function cityEthnicityPie(city) {
if (!city?.ethnicityComposition?.size) return "";
const entries = [...city.ethnicityComposition]
.filter(([, count]) => count > 0)
if (!city) return "";
let entries = [...(city.ethnicityComposition || new Map())]
.map(([id, count]) => [id, Number(count)])
.filter(([, count]) => Number.isFinite(count) && count > 0)
.sort((a, b) => b[1] - a[1]);
if (!entries.length && city.population > 0) {
const tile = sim.world.idx(city.x, city.y);
const fallbackId = sim.world.dominantEthnicity[tile] > 0 ? sim.world.dominantEthnicity[tile] : null;
if (fallbackId != null) entries = [[fallbackId, city.population]];
}
const total = entries.reduce((sum, [, count]) => sum + count, 0);
if (total <= 0) return "";
const top = entries.slice(0, 5);
const other = entries.slice(5).reduce((sum, [, count]) => sum + count, 0);
const slices = other > 0 ? [...top, [0, other]] : top;
const sliceColor = id => {
const ethnicity = id !== 0 ? sim.ethnicities.get(id) : null;
return ethnicity?.color || [122, 130, 126];
};
let cursor = 0;
const gradient = slices.map(([id, count]) => {
const start = cursor / total * 100;
cursor += count;
const end = cursor / total * 100;
const ethnicity = id ? sim.ethnicities.get(id) : null;
const color = ethnicity?.color || [122, 130, 126];
const color = sliceColor(id);
return `rgb(${color.join(",")}) ${start.toFixed(2)}% ${end.toFixed(2)}%`;
}).join(", ");
const labels = slices.map(([id, count]) => {
const ethnicity = id ? sim.ethnicities.get(id) : null;
const color = ethnicity?.color || [122, 130, 126];
const label = id ? `E${id}` : "Other";
const color = sliceColor(id);
const label = id !== 0 ? `E${id}` : "Other";
return `<span class="ethnicity-pie-key"><i style="background: rgb(${color.join(",")})"></i>${label} ${Math.round(count / total * 100)}%</span>`;
}).join("");
const background = slices.length === 1
? `rgb(${sliceColor(slices[0][0]).join(",")})`
: `conic-gradient(${gradient})`;
return `
<div class="ethnicity-pie-wrap">
<div class="ethnicity-pie" style="background: conic-gradient(${gradient})"></div>
<div class="ethnicity-pie" style="background: ${background}"></div>
<div class="ethnicity-pie-labels">${labels}</div>
</div>
`;