fix: Changed map radiusScale for increased size for small values

CHANGELOG.md

@@ -20,6 +20,7 @@ You can also check the
   - Fixed preview via API (iframe)
   - Fixed cut table scroll-bars and unnecessary scroll of bar charts when
     switching between chart types
+  - Fixed map dimension symbols to increase the elements size for small values, whilst preventing any 0 and undefined values from displaying
   - Added Footer to the Profile Page
 
 # [5.0.2] - 2024-11-28

app/charts/map/map-state.tsx

@@ -154,11 +154,22 @@ const useMapState = (
     // encode only the color of symbols, and the size is irrelevant.
     if (symbolLayerState.dataDomain[1] === undefined) {
       return scaleSqrt().range([0, 12]).unknown(12);
-    } else {
-      return scaleSqrt()
-        .domain([0, symbolLayerState.dataDomain[1]])
-        .range([0, 24]);
     }
+
+    const baseScale = scaleSqrt()
+      .domain([0, symbolLayerState.dataDomain[1]])
+      .range([0, 24]);
+
+    const wrappedScale = (x: number | null) => {
+      if (x === null || x === undefined) return 0;
+      if (x === 0) return 0;
+      const scaled = baseScale(x);
+      return Math.max(2, scaled);
+    };
+
+    Object.assign(wrappedScale, baseScale);
+
+    return wrappedScale;
   }, [symbolLayerState.dataDomain]) as ScalePower<number, number>;
 
   const preparedSymbolLayerState: MapState["symbolLayer"] = useMemo(() => {