Work with Stores

Detailed guide on using the StoresService to search and autocomplete on stores.

  1. Overview
  2. Getting started
  3. Stores Search


The StoresService class is a part of the Woosmap Map JavaScript API that allows you to interact with store data. It provides methods for searching stores, autocompleting store names and compute bounds for a stores search request.

Following operations from Stores are supported:

Review the example below to see how to search for stores and display results using the Woosmap Map JS:

Getting started

Before using the Stores Search service in the Map JavaScript API, it is required to have a secure and valid Woosmap API key and enable the Stores Search API for it.

Next, you must load the Map JS API library by including a script tag in your HTML page as follows:

        <script async


The is an object literal used when invoking the method from the Woosmap Map JS API. This object sends a request to the Search endpoint of Woosmap Stores API.

Here are the fields included in the StoresSearchRequest object:

Type definition for StoresSearchRequest
    latLng?: |,
    page?: number,
    polyline?: string,
    query?: string,
    radius?: number,
    storesByPage?: number,
    zone?: boolean


Below is a sample StoresSearchRequest to retrieves a maximum of 15 stores within a 50km radius of the specified location:

        const storesSearchRequest = {
    latLng: {lat: 43.610, lng: 3.876},
    radius: 50000,
    storesByPage: 15,


The search() method from is asynchronous and returns a Promise object. This Promise resolves to a StoresSearchResponse object upon successful operation.

        const storesService = new;
    .then((response) => {
    .catch((error) => {
    .finally(() => {


The StoresSearchResponse is a GeoJSON of type “FeatureCollection”. For more information on the stores format, see the StoresSearchResponse on the reference.

Display Stores Search Results

To display the stores returned by the search() method, you can add Markers or use the Map Data Layer. Data layer has the advantage of being able to display GeoJSON source. Here is an example of how to display stores using this layer:

        const myMap = new"map")); => {
    return { icon: "" };

const storesService = new;
function handleStoresSearch(latlng, originalLatLng) {
  const searchRequest = {
    storesByPage: 15,
    latLng: latlng

function displayStoresSearchResults(stores) {;

Was this article helpful?
Have more questions? Submit a request