smeijer / leaflet-geosearch

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

How to get data separately? city, street, counter... #217

Closed RonAlmog closed 4 years ago

RonAlmog commented 4 years ago

I use this package to get correct address from users. the thing is, i get the address in the 'label' field as one long string, like '22, Ravel Drive, Thornhill, Vaughan, York Region, Golden Horseshoe, Ontario, L4J 8A7, Canada' i need to get the different fields. would be best for me to get something like: { street: 'Ravel Drive, streetNo: '22', city: 'Thornhill' ... } is there any way to get that?

RonAlmog commented 4 years ago

needless to say that i tried to split the string by comma and extract the values. problem is, that the array length is different every time, so street no for example is not always the first...

smeijer commented 4 years ago

If I understand correct, you just use the provider? Not the leaflet control?

The provider returns you the results, including a raw property. That raw property contains all the information that your provider (/host) returns.

Which provider are you using?

OpenStreetMap (nominatim) doesn't return any segments as far as I know.

Bing contains an raw.address property that looks like:

{
  address: {
    adminDistrict: 'South Holland',
    adminDistrict2: 'Den Haag',
    countryRegion: 'Netherlands',
    formattedAddress: 'Madurodam, Netherlands',
    locality: 'The Hague'
  }
}

Google contains a raw.address_components like:

[
  {
    long_name: '1',
    short_name: '1',
    types: [
      'street_number'
    ]
  },
  {
    long_name: 'George Maduroplein',
    short_name: 'George Maduroplein',
    types: [
      'route'
    ]
  },
  {
    long_name: 'Scheveningen',
    short_name: 'Scheveningen',
    types: [
      'political',
      'sublocality',
      'sublocality_level_1'
    ]
  },
  {
    long_name: 'Den Haag',
    short_name: 'Den Haag',
    types: [
      'locality',
      'political'
    ]
  },
  {
    long_name: 'Den Haag',
    short_name: 'Den Haag',
    types: [
      'administrative_area_level_2',
      'political'
    ]
  },
  {
    long_name: 'Zuid-Holland',
    short_name: 'ZH',
    types: [
      'administrative_area_level_1',
      'political'
    ]
  },
  {
    long_name: 'Netherlands',
    short_name: 'NL',
    types: [
      'country',
      'political'
    ]
  },
  {
    long_name: '2584 RZ',
    short_name: '2584 RZ',
    types: [
      'postal_code'
    ]
  }
]

OpenCage, has raw.components

{
  'ISO_3166-1_alpha-2': 'NL',
  'ISO_3166-1_alpha-3': 'NLD',
  _category: 'road',
  _type: 'road',
  city: 'Den Haag',
  continent: 'Europe',
  country: 'Nederland',
  country_code: 'nl',
  neighbourhood: 'Archipelbuurt',
  political_union: 'European Union',
  postcode: '2585 JC',
  road: 'Hubertusviaduct / Madurodam',
  road_type: 'motorway_junction',
  state: 'Zuid-Holland',
  state_code: 'ZH',
  suburb: 'Den Haag'
}
RonAlmog commented 4 years ago

thanks! i'm using OpenStreetMapProvider, which seems like the default. There is raw part, but it does not include that data. (only again, all together). So what i get is, that i should simply use another provider? ok, thanks!

smeijer commented 4 years ago

So what i get is, that i should simply use another provider? ok, thanks!

If you need that data, then yes.

vinceramcesoliveros commented 4 years ago

Hi, I was using nominatim as the provider for the OpenStreeMapProvider. I saw their documentation that it includes postal code here https://www.nominatim.org/release-docs/latest/api/Details/

When I tried to query through their search engine. I did not find any postal code in their json(html) response.

smeijer commented 4 years ago

I see. Nice! I'll add some examples to the docs later, but you can already use that with the current provider.

Based on the docs here: https://www.nominatim.org/release-docs/latest/api/Details/#output-details, the provider config that you need to enable this, would be:

import { OpenStreetMapProvider } from 'leaflet-geosearch';

const provider = new OpenStreetMapProvider({
  params: {
    addressdetails: 1
  }
});

const results = await provider.search({ query: input.value });

That will add a raw.address property to your results, that will look like:

// results[0].raw.address
{
  junction: 'Madurodam',
  road: 'Hubertusviaduct',
  neighbourhood: 'Archipelbuurt',
  suburb: 'The Hague',
  city: 'The Hague',
  state: 'South Holland',
  country: 'The Netherlands',
  postcode: '2585 JC',
  country_code: 'nl'
}
RonAlmog commented 4 years ago

great find. thanks to both of you!

vinceramcesoliveros commented 4 years ago

I have a question while getting the postal code. the postal code I want doesn't show in the search engine nor it doesn't show in the provider I'm using. It might be that I need to explicitly input the address that has its own Postal Code.

Here my Example would be the "Davao City" where the postal code is 8000. Maybe I'm querying a region instead of a city(despite Davao City does have multiple zip code).

Update: I thought I was looking for the Zip Code, but as I google it. There was a vast difference between Zip Code and Postal Code. and the one I'm getting the postal code is the address.

smeijer commented 4 years ago

Closing as the question has been answered, and the docs have been updated. I'll update them more later on though.

https://smeijer.github.io/leaflet-geosearch/providers/openstreetmap#optional-parameters

sweety-124 commented 2 years ago

I see. Nice! I'll add some examples to the docs later, but you can already use that with the current provider.

Based on the docs here: https://www.nominatim.org/release-docs/latest/api/Details/#output-details, the provider config that you need to enable this, would be:

import { OpenStreetMapProvider } from 'leaflet-geosearch';

const provider = new OpenStreetMapProvider({
  params: {
    addressdetails: 1
  }
});

const results = await provider.search({ query: input.value });

That will add a raw.address property to your results, that will look like:

// results[0].raw.address
{
  junction: 'Madurodam',
  road: 'Hubertusviaduct',
  neighbourhood: 'Archipelbuurt',
  suburb: 'The Hague',
  city: 'The Hague',
  state: 'South Holland',
  country: 'The Netherlands',
  postcode: '2585 JC',
  country_code: 'nl'
}

thank youu