This project implements a web-based store locator using Mapbox GL JS. Users can search for stores within a specified location and view them on a map. The application fetches store data from the Mapbox Geocoding API by dividing the specified location into multiple bounding boxes and fetching stores without worrying about the limit. You can adjust the size of bounding boxes according to your need . It then displays the stores on the map with custom markers
- Search for stores by location and store name
- Display stores on the map with custom markers
- Click on markers to view store details
- Filter stores based on location and store name
-
Clone the repository:
[git clone https://github.com/your-username/store-locator-web-map.git](https://github.com/ammar450/MapBox-Store-Locator.git)
-
Navigate to the project directory:
cd store-locator-web-map
-
Open the
index.html
file in your web browser. -
Enter a location and store name in the search bar and click "Search" to find stores.
- Enter a location (e.g., city or country) in the "Enter location" input field.
- Enter a store name in the "Enter store name" input field (optional).
- Click the "Search" button to search for stores within the specified location.
- Click on a store in the sidebar to fly to its location on the map.
To use this application, you need a Mapbox access token. You can obtain one by signing up at Mapbox. Once you have an access token, replace 'YOUR_MAPBOX_ACCESS_TOKEN'
in the main.js
file with your actual access token.
This project is licensed under the MIT License - see the LICENSE file for details.