Source: https://developers.woosmap.com/products/mobile/react-native/markers/

> For clean Markdown of any page, append `.md` to the page URL.

> For a complete documentation index, see https://developers.woosmap.com/llms.txt

# Woosmap for React Native - Marker



Display markers to identify locations on Woosmap Map.
Markers are used to display clickable/draggable icons on the map. You can attach a wide variety of event listeners to control user interaction.

1. Instantiating a Marker with WoosmapView.

``` typescript
   let marker: Marker | null;

  const mapOptions: Object = {
    center: { lat: 51.515, lng: -0.13 },
    zoom: 10,
  };
  const add = function () {
    if (marker === undefined) {
      if (mapRef.current) {
        marker = new Marker(
          {
            position: { lat: 51.522, lng: -0.13 },
            icon: {
              url: 'https://images.woosmap.com/dot-marker.png',
              scaledSize: { height: 64, width: 46 },
            },
          },
          mapRef.current,
          {
            click: () => {
              console.log('marker click');
            },
          }
        );
        marker.add();
      }
    }
  };
   <WoosmapView
        ref={mapRef}
        mapOptions={mapOptions}
        wooskey={'Your Woosmap key'}
        loaded={() => {
          add();
        }}
      />

```

Please check the javascript guide for more implementation. [javascript guide](/products/map-api/guides/markers/)
