Fix NanoMap for Tether

tgui/packages/tgui/components/NanoMap.js

@@ -110,8 +110,15 @@ const NanoMapMarker = (props, context) => {
     tooltip,
     color,
   } = props;
-  const rx = -256 * (zoom - 1) + x * (2 * zoom) - 1.5 * zoom - 3;
-  const ry = 512 * zoom - (y * 2 * zoom) + zoom - 1.5;
+  // Please note, the horrifying `3.65714285714` is just the ratio of the
+  // width/height of the minimap *element* (not image)
+  // to the actual turf size of the map
+  const rx = (-256 * (zoom - 1) 
+    + (x * (3.65714285714 * zoom)) 
+    - 1.5 * zoom - 3);
+  const ry = (512 * zoom 
+    - (y * (3.65714285714 * zoom))
+    + zoom - 1.5);
   return (
     <div style={"transform: scale(" + 1 / zoom + ")"}>
       <Box

tgui/packages/tgui/interfaces/CrewMonitor.js

@@ -102,15 +102,17 @@ export const CrewMonitor = (props, context) => {
           maxValue={8}
           onChange={(e, value) => setZoom(value)} />
         Z-Level:
-        {data.map_levels.map(level => (
-          <Button
-            key={level}
-            selected={~~level === ~~config.mapZLevel}
-            content={level}
-            onClick={() => {
-              act("tgui:setZLevel", { "mapZLevel": level });
-            }} />
-        ))}
+        {data.map_levels
+          .sort((a, b) => Number(a) - Number(b))
+          .map(level => (
+            <Button
+              key={level}
+              selected={~~level === ~~config.mapZLevel}
+              content={level}
+              onClick={() => {
+                act("tgui:setZLevel", { "mapZLevel": level });
+              }} />
+          ))}
         <NanoMap zoom={mapZoom}>
           {crew
             .filter(x =>