fix: color home country purple on world map

This commit is contained in:
haerikimmm
2026-06-16 19:42:42 +09:00
parent 2226a483c5
commit 665472b281

View File

@@ -6,6 +6,7 @@
import { getSelected, setTotalCount, getFlashing } from '../layout/selection.svelte.js';
import { getUserProfile } from '../auth/userStore.svelte.js';
import homeIconUrl from '../../assets/home.png';
import { nameToId } from '../shared/countries.js';
import crayonCursorUrl from '../../assets/logo-cursor.png';
let { onCountryClick = (_name) => {} } = $props();
@@ -111,11 +112,17 @@
proj.scale(s).translate([w / 2, h * 0.70]);
}
function getHomeCode() {
const name = getUserProfile()?.homeCountry;
return name ? (nameToId[name] ?? null) : null;
}
function updateAllFills() {
const sel = getSelected();
const hc = getHomeCode();
if (!_paths || !_g) return;
_paths.attr('fill', d => countryColor(d, sel, null));
_g.selectAll('.micro-state').attr('fill', d => countryColor(d, sel, null));
_paths.attr('fill', d => countryColor(d, sel, hc));
_g.selectAll('.micro-state').attr('fill', d => countryColor(d, sel, hc));
}
$effect(updateAllFills);
@@ -178,7 +185,7 @@
})
.on('mouseenter', (event, d) => {
const s = getSelected();
d3.select(event.currentTarget).attr('fill', countryHoverColor(d, s, null));
d3.select(event.currentTarget).attr('fill', countryHoverColor(d, s, getHomeCode()));
tooltip.style('display', 'block').text(d.properties.name);
})
.on('mousemove', (event) => {
@@ -187,7 +194,7 @@
})
.on('mouseleave', (event, d) => {
const s = getSelected();
d3.select(event.currentTarget).attr('fill', countryColor(d, s, null));
d3.select(event.currentTarget).attr('fill', countryColor(d, s, getHomeCode()));
tooltip.style('display', 'none');
});
}
@@ -215,7 +222,7 @@
.attr('cx', cx)
.attr('cy', cy)
.attr('r', 2)
.attr('fill', countryColor(d, getSelected(), null))
.attr('fill', countryColor(d, getSelected(), getHomeCode()))
.attr('stroke', '#94a3b8')
.attr('stroke-width', 0.5);
attachEvents(c);