Rescale marker size to prevent Manhattan/BK overlap

jaryncolbert · Jun 27, 2019 · a7b78e3 · a7b78e3
1 parent 97b74be
commit a7b78e3
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 3 deletions.
diff --git a/src/components/map/Legend.js b/src/components/map/Legend.js
@@ -0,0 +1,17 @@
+import React from "react";
+
+export function Legend() {
+    return (
+        <div className="map-legend">
+            <span className="circle-icon">pop</span>
+            <span>
+                : Single City with <i>{"${pop}"}</i> RCers
+            </span>
+            <span className="circle-cluster">pop</span>
+            <span>
+                : Cluster of Cities <i>{"${pop}"}</i> RCers (Click to Expand
+                Cluster)
+            </span>
+        </div>
+    );
+}
diff --git a/src/components/map/LocationMarker.js b/src/components/map/LocationMarker.js
@@ -50,9 +50,9 @@ const getProps = size => {
         10: { radius: 50, class: "sm" },
         20: { radius: 65, class: "lg" },
         50: { radius: 80, class: "lg" },
-        100: { radius: 150, class: "xl" },
-        200: { radius: 250, class: "xl" },
-        400: { radius: 350, class: "xxl" },
+        100: { radius: 90, class: "xl" },
+        200: { radius: 100, class: "xl" },
+        400: { radius: 150, class: "xxl" },
         5000: { radius: 500, class: "xxl" }
     };
     // Find the first key that is greater than the original size