diff --git a/app/components/map/MapView.tsx b/app/components/map/MapView.tsx index b87e50a..1a5524d 100644 --- a/app/components/map/MapView.tsx +++ b/app/components/map/MapView.tsx @@ -305,7 +305,10 @@ const Map: React.FC = () => { rotateEnabled={false} region={defaultMapRegion} onPanDrag={() => setIsViewCenteredOnUser(false)} + // this deprcation is ok, we only use it on android + maxZoomLevel={Platform.OS == "android" ? 18 : undefined} showsMyLocationButton={false} // we have our own + // fix dark mode android map syling customMapStyle={Platform.OS == "android" && theme.mode == "dark" ? DarkGoogleMaps : undefined} > {/* Route Polylines */} diff --git a/app/components/map/markers/BusMarker.tsx b/app/components/map/markers/BusMarker.tsx index d7fa641..ae07dbf 100644 --- a/app/components/map/markers/BusMarker.tsx +++ b/app/components/map/markers/BusMarker.tsx @@ -4,6 +4,7 @@ import BusMapIcon from '../BusMapIcon'; import BusCallout from '../BusCallout'; import { IVehicle } from 'utils/interfaces'; import useAppStore from '../../../data/app_state'; +import { Platform } from 'react-native'; interface Props { bus: IVehicle, @@ -31,7 +32,16 @@ const BusMarker: React.FC = ({ bus, tintColor, routeName }) => { tracksViewChanges={false} anchor={{x: 0.5, y: 0.5}} pointerEvents="auto" - style={{ zIndex: 100, elevation: 100 }} + style={[ + { zIndex: 100, elevation: 100}, + + Platform.OS == "android" && { + width: 42, + height: 42, + justifyContent: 'center', + alignItems: 'center' + } + ]} onPress={() => busDefaultDirection()} > {/* Bus Icon on Map*/} diff --git a/app/components/map/markers/RoutePlanMarker.tsx b/app/components/map/markers/RoutePlanMarker.tsx index 19a1e5c..29a74ff 100644 --- a/app/components/map/markers/RoutePlanMarker.tsx +++ b/app/components/map/markers/RoutePlanMarker.tsx @@ -1,7 +1,7 @@ import React, { memo } from 'react'; import { MapMarker, Marker } from 'react-native-maps'; import { RoutePlanMapMarker } from 'utils/interfaces'; -import { View } from 'react-native'; +import { Platform, View } from 'react-native'; import { getLighterColor } from 'app/utils'; import useAppStore from 'app/data/app_state'; @@ -21,6 +21,13 @@ const RoutePlanMarker: React.FC = ({ marker }) => { latitude: marker.latitude, longitude: marker.longitude }} + style={[ + Platform.OS == "android" && { + height: 72, + justifyContent: 'center', + alignItems: 'center' + } + ]} tracksViewChanges={false} anchor={{x: 0.5, y: 0.5}} pointerEvents="auto"