I would like to have search control for Leaflet, with suggestions to street addresses, like on this image from Google Maps:

enter image description here

Some of the plugins I tried (https://labs.easyblog.it/maps/leaflet-search/) don't give such results, when I typed some street name in them they offered either less or no suggestions. Here Google Maps responds properly for some random street name in my city.


A good tool is leaflet-control-geocoder (see demo with Google, Nominatim, Bing, and Mapbox services).

I prefer to use Mapbox for geocoding, it works much better with US addresses compared to Nominatim, at least in Connecticut. You will need to create an account and get the public API key. With their new pricing rolled out in June 2019, you get 100,000 geocoder requests per month for free.

First include the library in your HTML:

<link rel="stylesheet" href="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.css" />
<script src="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.js"></script>

You JavaScript will look something like that:

    position: 'topright',
    collapsed: false,
    placeholder: 'Search...',
    defaultMarkGeocode: true,
    geocoder: L.Control.Geocoder.mapbox('your-public-mapbox-key', {
      geocodingQueryParams: {
        country: 'us'
  • I used the little bit of JavaScript here to get the Mapbox geocoder to work in my Leaflet map, but it always sais "Nothing Found". – Pfalbaum Nov 2 '20 at 18:54

You can try the leaflet-geosearch plugin.
The OSM demo seems to be what you are looking for.

There are other options you can find on leaflet's plugins page.

Please remember that the quality of the results depends on the underlying data,
Google works very hard on their data. That's why it's no longer free to use.

Also note that the OSM Nominatim API is not meant to use in production and should not be used for bulk geocoding.
Nominatim Usage Policy

// Agregar el Search Box 
    position: "topright",
    placeholder: "Buscar Direccion",
    errorMessage: "Dirección no encontrada.",
    showResultIcons: true,
    defaultMarkGeocode: false
}).on('markgeocode', function(e) {
}    ).addTo(objMap);
  • How does this answer the question? Could you add some more detail please? – Kadir Şahbaz Feb 16 at 17:34

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.