Need to add a Custom Marker like google Map has, a red marker

[aasix786]

Please help me out in placing a custom marker

this marker. What I see is an Airport Icon named as airport-15. const featureCollection = { type: 'FeatureCollection', features: [ { type: 'Feature', id: '9d10456e-bdda-4aa9-9269-04c1667d4552d', properties: { icon: 'airport-15', }, geometry: { type: 'Point', coordinates: [74.35134887695312,31.522361470421437], }, }, { type: 'Feature', id: '9d10456e-bdda-4aa9-9269-04c1667d4552s', properties: { icon: 'airport-15', }, geometry: { type: 'Point', coordinates: [-117.205908, 52.180843], }, }, { type: 'Feature', id: '9d10456e-bdda-4aa9-9269-04c1667d4552a', properties: { icon: 'airport-15', }, geometry: { type: 'Point', coordinates: [-117.206562, 52.180797], }, }, ], };

      <MapboxGL.MapView style={styles.map}>
      <MapboxGL.Camera
        zoomLevel={17}
        centerCoordinate={[74.35134887695312,31.522361470421437]}
      />
      <MapboxGL.Images images={{example: "../../asset/icons/marker.png", assets: ['pin']}} />
      <MapboxGL.ShapeSource
        id="exampleShapeSource"
        shape={featureCollection}>
        <MapboxGL.SymbolLayer id="exampleIconName" style={{
iconImage: ['get', 'icon'],

iconSize: [
  'match',
  ['get', 'icon'],
  'example',
  1.2,
  'example',
  1.2,
  /* default */ 1,
],

}} /> </MapboxGL.ShapeSource> </MapboxGL.MapView>

Here is the code what I have implemented.

Please help me out in adding a custom marker .png. Prefer if you share some code to add in existing one. Thanks