CODEWITHSUNDEEP
react-nativereact-native-maps
user14811813
user14811813

Reputation:

How can I add gif to custom marker?

I want to add gip to image source in the marker, my app shows nothing as marker

Here is my code....

<MapView
  initialRegion={region}
  maxZoomLevel={17}
  region={region}
>
  {region.latitude !== 0 ? (
    <Marker
      minDelta={0.5}
      maxDelta={2}
      coordinate={{
        latitude: region.latitude,
        longitude: region.longitude,
      }}
      title={'You are here!'}
    >
      <View style={{height: 10, width: 10}}>
        <Image 
          resizeMode="center"
          source={require('../src/images/1.gif')} 
        />
      </View>
    </Marker>
  ): null}
</MapView>

How i add gif to the marker?? Do i need animated marker for this???

Upvotes: 1

Views: 530

Answers (2)

Franco Petra
Franco Petra

Reputation: 1032

For react-native-maps you can add it as a child component like this:

    <Marker
     key={id}
     coordinate={coords}
     title={title}
     onSelect={setMarker}
    >
       <Image
          source={require('../../../../assets/gifs/portal.gif')}
          style={{alignSelf: 'center'}}
       />
    </Marker>

Upvotes: 1

Nooruddin Lakhani
Nooruddin Lakhani

Reputation: 6967

Try this way

<MapView.Marker
  minDelta={0.5}
  maxDelta={2}
  coordinate={markerInfo.location}>

    <Image style={styles.image} source={require('../src/images/1.gif')} />
</MapView.Marker>

Upvotes: 1

Related Questions