Skip to main content

Search input

Simple Search input using mapy.cz suggestion API. Suggestions are shown as a dropdown with icons and basic information about the result (Like "Praha - capital city, Czechia"). When result is selected, map is automatically updated to point position.

How to use it

import { MapProvider, Map, SearchInput } from 'mapy-cz-react';

<MapProvider center={{ lat: 50.096406, lng: 14.463071 }} id="map-example">
<SearchInput />
<Map />
</MapProvider>;

Props

NameTypeDefaultDescriptionRequired
classNamestring""Class names applied to input component
disableGeolocationboolfalseFlag disabling geolocation of input value on submit
disableSuggestboolfalseFlag disabling suggestion dropdown
inputCompstring\elementType"input"Custom Input component to be used
inputValuestringundefinedValue of input. With onValueChange handler prop makes component controled.
onSuggestItemSelectfuncundefinedCallback called after suggestion
onValueChangefuncundefinedSetter for input value. With inputValue prop makes component controled

Example

Live Editor
Result
Loading...