mirror of
https://github.com/dpup/meshstream.git
synced 2026-08-12 03:32:54 +02:00
Break up NodeDetail into sub components
This commit is contained in:
+53
-6
@@ -2,6 +2,49 @@
|
||||
* Utility functions for working with maps and coordinates
|
||||
*/
|
||||
|
||||
/**
|
||||
* Calculate the position accuracy in meters using precision bits
|
||||
* @param precisionBits Number of precision bits used in position encoding
|
||||
* @returns Accuracy radius in meters
|
||||
*/
|
||||
export const calculateAccuracyFromPrecisionBits = (
|
||||
precisionBits?: number
|
||||
): number => {
|
||||
if (!precisionBits) return 300; // Default accuracy of 300m
|
||||
|
||||
// Each precision bit halves the accuracy radius
|
||||
// Starting with Earth's circumference (~40075km), calculate the precision
|
||||
// For reference: 24 bits = ~2.4m accuracy, 21 bits = ~19m accuracy
|
||||
const earthCircumference = 40075000; // in meters
|
||||
const accuracy = earthCircumference / 2 ** precisionBits / 2;
|
||||
|
||||
// Limit to reasonable values
|
||||
return Math.max(1, Math.min(accuracy, 10000));
|
||||
};
|
||||
|
||||
/**
|
||||
* Calculate appropriate zoom level based on accuracy
|
||||
* @param accuracyMeters Accuracy in meters
|
||||
* @returns Zoom level (1-20)
|
||||
*/
|
||||
export const calculateZoomFromAccuracy = (accuracyMeters: number): number => {
|
||||
// Roughly map accuracy to zoom level (higher accuracy = higher zoom)
|
||||
// < 10m: zoom 18
|
||||
// < 50m: zoom 16
|
||||
// < 100m: zoom 15
|
||||
// < 500m: zoom 14
|
||||
// < 1km: zoom 13
|
||||
// < 5km: zoom 11
|
||||
// >= 5km: zoom 10
|
||||
if (accuracyMeters < 10) return 18;
|
||||
if (accuracyMeters < 50) return 16;
|
||||
if (accuracyMeters < 100) return 15;
|
||||
if (accuracyMeters < 500) return 14;
|
||||
if (accuracyMeters < 1000) return 13;
|
||||
if (accuracyMeters < 5000) return 11;
|
||||
return 10;
|
||||
};
|
||||
|
||||
/**
|
||||
* Generate a Google Maps Static API URL for a given latitude and longitude
|
||||
* @param latitude The latitude in decimal degrees
|
||||
@@ -11,7 +54,6 @@
|
||||
* @param height The image height in pixels
|
||||
* @param nightMode Whether to use dark styling for the map
|
||||
* @param precisionBits Optional precision bits to determine how to display the marker
|
||||
* @param accuracyMeters Optional accuracy in meters (used when precisionBits is provided)
|
||||
* @returns A URL string for the Google Maps Static API
|
||||
*/
|
||||
export const getStaticMapUrl = (
|
||||
@@ -21,8 +63,7 @@ export const getStaticMapUrl = (
|
||||
width: number = 300,
|
||||
height: number = 200,
|
||||
nightMode: boolean = true,
|
||||
precisionBits?: number,
|
||||
accuracyMeters?: number
|
||||
precisionBits?: number
|
||||
): string => {
|
||||
// Get API key from environment variable
|
||||
const apiKey = import.meta.env.VITE_GOOGLE_MAPS_API_KEY || "";
|
||||
@@ -40,12 +81,18 @@ export const getStaticMapUrl = (
|
||||
|
||||
// Only add marker if we don't have precision information
|
||||
if (precisionBits === undefined) {
|
||||
mapUrl.searchParams.append("markers", `color:green|${latitude},${longitude}`);
|
||||
}
|
||||
mapUrl.searchParams.append(
|
||||
"markers",
|
||||
`color:green|${latitude},${longitude}`
|
||||
);
|
||||
}
|
||||
// With static maps we can't draw circles directly, so we use a marker with different color
|
||||
// even when we have precision information, but we'll show it differently in the interactive map
|
||||
else {
|
||||
mapUrl.searchParams.append("markers", `color:green|${latitude},${longitude}`);
|
||||
mapUrl.searchParams.append(
|
||||
"markers",
|
||||
`color:green|${latitude},${longitude}`
|
||||
);
|
||||
}
|
||||
|
||||
// Apply night mode styling using the simpler approach
|
||||
|
||||
Reference in New Issue
Block a user