mirror of
https://github.com/LukeHagar/website.git
synced 2025-12-09 12:57:48 +00:00
update
This commit is contained in:
@@ -59,7 +59,7 @@
|
|||||||
'group absolute flex size-3 cursor-pointer items-center justify-center opacity-0 [animation-delay:var(--delay)]',
|
'group absolute flex size-3 cursor-pointer items-center justify-center opacity-0 [animation-delay:var(--delay)]',
|
||||||
{ 'animate-fade-in': animate }
|
{ 'animate-fade-in': animate }
|
||||||
)}
|
)}
|
||||||
style="left:{position.x}px; top:{position.y}px; --delay:{index * 10}ms;"
|
style="left:{position.x}%; top:{position.y}%; --delay:{index * 10}ms;"
|
||||||
data-region={slugify(city)}
|
data-region={slugify(city)}
|
||||||
data-active={isOpen}
|
data-active={isOpen}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -16,18 +16,13 @@ export const latLongToSvgPosition = ({
|
|||||||
width,
|
width,
|
||||||
height
|
height
|
||||||
}: Coordinates & { width: number; height: number }) => {
|
}: Coordinates & { width: number; height: number }) => {
|
||||||
let adjustedLong = longitude;
|
const { west, east, north, south } = MAP_BOUNDS;
|
||||||
if (longitude < MAP_BOUNDS.west) {
|
|
||||||
adjustedLong += 360;
|
|
||||||
} else if (longitude > MAP_BOUNDS.east) {
|
|
||||||
adjustedLong -= 360;
|
|
||||||
}
|
|
||||||
|
|
||||||
const x = ((adjustedLong - MAP_BOUNDS.west) / (MAP_BOUNDS.east - MAP_BOUNDS.west)) * width;
|
const lngRatio = (longitude - west) / (east - west);
|
||||||
const latRatio = (MAP_BOUNDS.north - latitude) / (MAP_BOUNDS.north - MAP_BOUNDS.south);
|
const latRatio = (north - latitude) / (north - south);
|
||||||
|
|
||||||
const adjustedLatRatio = Math.pow(latRatio, 0.95) * 0.96 + latRatio * 0.04;
|
const x = Math.max(0, Math.min(1, lngRatio)) * 100; // % instead of px
|
||||||
const y = adjustedLatRatio * height;
|
const y = Math.max(0, Math.min(1, latRatio)) * 100;
|
||||||
|
|
||||||
return { x, y };
|
return { x, y };
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user