81a7e5d62e
* esm * wip * wip * wip * wip * wip * wip * subscription notice * wip * wip * wip * fix envs * fix: update docker build * fix * esm/types * delete dashboard :D * add patches to dockerfiles * update packages + catalogs + ts * wip * remove native libs * ts * improvements * fix redirects and fetching session * try fix favicon * fixes * fix * order and resize reportds within a dashboard * improvements * wip * added userjot to dashboard * fix * add op * wip * different cache key * improve date picker * fix table * event details loading * redo onboarding completely * fix login * fix * fix * extend session, billing and improve bars * fix * reduce price on 10M
44 lines
1.4 KiB
TypeScript
44 lines
1.4 KiB
TypeScript
import { useCallback, useState } from 'react';
|
|
|
|
import type { Coordinate } from './coordinates';
|
|
|
|
const useActiveMarkers = (initialMarkers: Coordinate[]) => {
|
|
const [activeMarkers, setActiveMarkers] = useState(initialMarkers);
|
|
|
|
const toggleActiveMarkers = useCallback(() => {
|
|
// Shuffle array function
|
|
const shuffled = [...initialMarkers].sort(() => 0.5 - Math.random());
|
|
// Cut the array in half randomly to simulate changes in active markers
|
|
const selected = shuffled.slice(
|
|
0,
|
|
Math.floor(Math.random() * shuffled.length) + 1,
|
|
);
|
|
setActiveMarkers(selected);
|
|
}, [activeMarkers]);
|
|
|
|
return { markers: activeMarkers, toggle: toggleActiveMarkers };
|
|
};
|
|
|
|
export default useActiveMarkers;
|
|
|
|
export function calculateMarkerSize(count: number) {
|
|
const minSize = 3; // Minimum size for single visitor (reduced from 4)
|
|
const maxSize = 14; // Maximum size for very large clusters (reduced from 20)
|
|
|
|
if (count <= 1) return minSize;
|
|
|
|
// Use square root scaling for better visual differentiation
|
|
// This creates more noticeable size differences for common visitor counts
|
|
// Examples:
|
|
// 1 visitor: 3px
|
|
// 2 visitors: ~5px
|
|
// 5 visitors: ~7px
|
|
// 10 visitors: ~9px
|
|
// 25 visitors: ~12px
|
|
// 50+ visitors: ~14px (max)
|
|
const scaledSize = minSize + Math.sqrt(count - 1) * 1.8;
|
|
|
|
// Ensure size does not exceed maxSize or fall below minSize
|
|
return Math.max(minSize, Math.min(scaledSize, maxSize));
|
|
}
|