I'm trying to reduce the size of the marker on my map, as it is too big.
The problem is that using style = {} does not seem to work in this case.
What am I missing here?
<MapView.Marker
coordinate={{ latitude: 52.78825, longitude: 13.4324 }}
title="This should be me"
description="Some description"
image={require('../assets/icon.png')}
style={{width: 26, height: 28}}
>
To generate a custom style go to the Google Maps Styling Wizard. With the Google Maps Styling Wizard you can create a unique style for your react native map. Using the basic editor you can choose from six themes and change the density of roads, landmarks, and labels.
It takes a region object which has latitudeDelta and longitudeDelta . Use these to set the zoom level. Updated: in a Region object the latitude and longitude specify the center location and latitudeDelta and longitudeDelta specify the span of the viewable map area.
Adding a marker in React Native MapsStart by importing Marker from react-native-maps . import { Marker } from "react-native-maps"; Next, render the <Marker /> component as a child of <MapView /> . Pass the coordinate for the marker in the coordinate prop.
Few alternatives for google maps in react native : Mapbox - https://www.npmjs.com/package/@mapbox/react-native-mapbox-gl. Yandex Map - https://www.npmjs.com/package/react-native-yandexmapkit.
you can render the marker in this manner as per documentation here:
<Marker ...>
<Image
source={require('../assets/icon.png')}
style={{width: 26, height: 28}}
resizeMode="contain"
/>
</Marker>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With