Airports Geo Search

This demo indexes 78K Airports around the world and lets you browse them on a map, search by airport details, and filter by a variety of parameters like airport type, elevation, number of runways, etc.

This implementation uses Next.js with React for the frontend and uses react-instantsearch with typesense-instantsearch-adapter for making search queries to Typesense.

Live Demo | Source Code

Key Highlights

• Here's how to configure the typesense-instantsearch-adapter for geo search.
• Here's how to render the results returned from Typesense as custom markers on Google Maps.
• Here's how to perform the search when the user pans the map.
• Here's how to automatically pan the map to first match from search results.
• Here's how to read map bounds from the URL on first page load when routing is enabled on react-instantsearch to store search parameters in the URL.
• Here's how to use refinement lists for filtering.
• Here's how to use range sliders for filtering.