diff --git a/src/components/MapView/MapView.tsx b/src/components/MapView/MapView.tsx
index 553be816cf3f..59102e55c930 100644
--- a/src/components/MapView/MapView.tsx
+++ b/src/components/MapView/MapView.tsx
@@ -214,6 +214,10 @@ const MapView = forwardRef<MapViewHandle, ComponentProps>(
                     pitchEnabled={pitchEnabled}
                     attributionPosition={{...styles.r2, ...styles.b2}}
                     scaleBarEnabled={false}
+                    // We use scaleBarPosition with top: -32 to hide the scale bar on iOS because scaleBarEnabled={false} not work on iOS
+                    scaleBarPosition={{...styles.tn8, left: 0}}
+                    compassEnabled
+                    compassPosition={{...styles.l2, ...styles.t5}}
                     logoPosition={{...styles.l2, ...styles.b2}}
                     // eslint-disable-next-line react/jsx-props-no-spreading
                     {...responder.panHandlers}
diff --git a/src/styles/utils/positioning.ts b/src/styles/utils/positioning.ts
index 5e0169990499..c266a7469bc2 100644
--- a/src/styles/utils/positioning.ts
+++ b/src/styles/utils/positioning.ts
@@ -22,6 +22,9 @@ export default {
     t0: {
         top: 0,
     },
+    t5: {
+        top: 20,
+    },
     tn4: {
         top: -16,
     },