smeijer / leaflet-geosearch

A geocoding/address-lookup library supporting various api providers.
https://smeijer.github.io/leaflet-geosearch/
MIT License
1.02k stars 271 forks source link

Add Bounds to Restrict Search Results #225

Open tripinva opened 4 years ago

tripinva commented 4 years ago

I currently use leaflet-control-osm-geocoder to provide a search on my website's maps. Having compared the two, I prefer the look and behavior of leaflet-geosearch. I am also considering using something other than OpenStreetMaps in the future, which would make leaflet-control-osm-geocoder not useful, and I like the flexibility that leaflet-geosearch provides. These things make me want to migrate to leaflet-geosearch and use it going forward.

But two issues prevent me from switching to it. One is issue #191 since my search box is at the bottom left corner of my map. The other is that my maps are only valid in the US, Canada, and US territories. leaflet-control-osm-geocoder allows me to set bounds and only return search results within those bounds, so results from Europe, for example, will not be returned. Is it possible to add a similar feature to leaflet-geosearch? Putting my zip code (22303) into leaflet-geosearch gives me two results in Germany before the first US result, while putting it into my bounded leaflet-control-gsm-geocoder gives me a location near me in the US.

If a future release is able to do something to alleviate these issues, I will gladly submit my website per issue #216 for inclusion.

Thank you!

smeijer commented 4 years ago

Hi @tripinva,

I think both issues are already possible, or otherwise easy to support.

When you talk about style and position, are you talking about the bar style?:

image

or button style?:

image


When talking about restrictions, leaflet-geosearch supports all restrictions that the providers support. We don't control those properties, we just pass them through to the servers.

In case of open streetmap, the restriction parameters can be found here: https://nominatim.org/release-docs/develop/api/Search/#result-limitation

Result limitation

  • countrycodes=<countrycode>[,<countrycode>][,<countryside>]...

Limit search results to one or more countries. must be the ISO 3166-1alpha2 code, e.g. gb for the United Kingdom, de for Germany.

That would translate to:

const provider = new OpenStreetMapProvider({
  params: {
    'accept-language': 'en', // render results in English
    countrycodes: 'ca,us', // limit search results to Canada & United States
  },
});
tripinva commented 4 years ago

Ah! I had completely overlooked that page of the documentation. And filtering by country is actually better than the lat/lon based limitation I've been using. Excellent! So there's no actual issue here; my apologies.

As to #191, I'm using the button style. As it's all the way at the bottom left, the results get cut off at the bottom of the map. See here: https://imgur.com/a/q8kroul I'd prefer for the results to go up rather than down from the search box, and I didn't see an obvious way to make that happen, though I admit my CSS is not as good as it should be.

Separately, I noticed that I have "scroll to zoom" enabled in my Leaflet map, but as soon as I enter text in the leaflet-geosearch text box, scrolling instead scrolls the page rather than zooming the map. I have to refresh the page to resolve the issue. Is it something I've done wrong?

tripinva commented 4 years ago

To be clear, the "scroll to zoom" issue appears only when I have autoClose: true. It works properly otherwise.

EDIT: Spoke too soon. Not sure how, but it worked for me exactly once, and now it's behaving the same way.

smeijer commented 4 years ago

Aah, that css issue should indeed be fixed. The button can be positioned at the bottom, but the list doesn't adjust properly.

The scrolling issue is something I need to take look at. Is it only as long as the search box is focused? Or just forever after you have clicked there once?

tripinva commented 4 years ago

Yes, that issue is spelled out in #191. I just was able to include a picture. =)

The scrolling issue is inconsistent. Just now, I was able to search without issue one or two times, then on the third time, the scroll to zoom stopped working. On another refresh, just typing two letters in the search box made it stop working, without actually moving to a location. It seems the issue causes dragging the map to stop working as well. I'm wondering if it's a conflict with another plugin, but I'm not sure what that could be. Perhaps tomorrow I'll try disabling other plugins one by one and seeing what happens, but I have yet to notice a pattern to it that would seem to relate it to any of the other plugins.

My browser is Waterfox, but it did the same thing on Chrome as well.