Leaflet – Adding Search Box by Cities in Leaflet JS

Question

I have developed an application using leaflet JS, which loads the services from the ArcGIS server via REST API.

I want to put a search box to search by cities. Should I load a base map to be able to search? How should I configure the search box?

Answer 1

You can use leaflet-control-geocoder in order to do that, all you have to do is include it in your JS code.

var map = L.map('map').setView([0, 0], 2);
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
L.Control.geocoder().addTo(map);