refactor(web/menu): properly align circle menu labels

overextended · Jan 21, 2023 · 1be71ea · 1be71ea
1 parent 6c9d3d2
commit 1be71ea
Showing 1 changed file with 3 additions and 6 deletions.
diff --git a/web/src/features/menu/planet/index.tsx b/web/src/features/menu/planet/index.tsx
@@ -138,13 +138,10 @@ const PlanetMenu: React.FC = () => {
           {menu.items.map((item, index) => {
             // TODO: center labels and icon inside sector
             const pieAngle = 360 / menu.items.length;
-            const startAngle = index * pieAngle;
-            const endAngle = startAngle + pieAngle;
-            console.log(startAngle + endAngle / 2);
-            const angle = degToRad((startAngle + endAngle) / 2);
+            const angle = degToRad(pieAngle / 2 + 90);
             const radius = 250 / 2;
-            const iconX = Math.sin(angle) * radius;
-            const iconY = Math.cos(angle) * radius;
+            const iconX = 250 + Math.sin(angle) * radius;
+            const iconY = 250 + Math.cos(angle) * radius;
 
             return (
               <>