From 1505b619b1460c53c54313cef82789f2a2fd6229 Mon Sep 17 00:00:00 2001
From: Heidi <clippii@protonmail.com>
Date: Sat, 16 May 2026 08:00:00 +0100
Subject: [PATCH] update viewers page

---
 src/App.jsx | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/App.jsx b/src/App.jsx
index b2b41a3..d27fa42 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -2513,7 +2513,11 @@ function ViewersPage({ viewers }) {
 function LocationSignalMap({ countries, locations }) {
   const mapRef = useRef(null)
   const markersRef = useRef(null)
-  const maxCountryVisitors = Math.max(1, ...countries.map((country) => Number(country.visitors || 0)))
+  const maxMarkerVisitors = Math.max(
+    1,
+    ...countries.map((country) => Number(country.visitors || 0)),
+    ...locations.map((location) => Number(location.visitors || 0)),
+  )
   const countryMarkers = countries
     .map((country) => {
       const lat = Number(country.latitude)
@@ -2594,7 +2598,8 @@ function LocationSignalMap({ countries, locations }) {
     layer.clearLayers()
 
     countryMarkers.forEach((country) => {
-      const radius = 10 + (Number(country.visitors || 0) / maxCountryVisitors) * 22
+      const share = Number(country.visitors || 0) / maxMarkerVisitors
+      const radius = 8 + Math.sqrt(share) * 34
       L.circleMarker([country.lat, country.lon], {
         color: '#e82517',
         fillColor: '#e82517',
@@ -2611,7 +2616,8 @@ function LocationSignalMap({ countries, locations }) {
     })
 
     cityMarkers.forEach((location) => {
-      const radius = 7 + (Number(location.visitors || 0) / maxCountryVisitors) * 16
+      const share = Number(location.visitors || 0) / maxMarkerVisitors
+      const radius = 5 + Math.sqrt(share) * 24
       L.circleMarker([location.lat, location.lon], {
         color: '#000000',
         fillColor: '#000000',
@@ -2626,7 +2632,7 @@ function LocationSignalMap({ countries, locations }) {
         })
         .addTo(layer)
     })
-  }, [cityMarkers, countryMarkers, maxCountryVisitors])
+  }, [cityMarkers, countryMarkers, maxMarkerVisitors])
 
   return (
     <div className="p-5">