marlove/react-native-geocoding

react-native-geocoding

A geocoding module for React Native to transform a description of a location (i.e. street address, town name, etc.) into geographic coordinates (i.e. latitude and longitude) and vice versa.

This module uses Google Maps Geocoding API and requires an API key for purposes of quota management. Please check this link out to obtain your API key.

Install

npm install --save react-native-geocoding

Example

import Geocoder from 'react-native-geocoding';

// Initialize the module (needs to be done only once)
Geocoder.init("xxxxxxxxxxxxxxxxxxxxxxxxx"); // use a valid API key
// With more options
// Geocoder.init("xxxxxxxxxxxxxxxxxxxxxxxxx", {language : "en"}); // set the language

// Search by address
Geocoder.from("Colosseum")
		.then(json => {
			var location = json.results[0].geometry.location;
			console.log(location);
		})
		.catch(error => console.warn(error));

// Search by address, with a biased geo-bounds
Geocoder.from("Pyramid", {
		southwest: {lat: 36.05, lng: -115.25},
		northeast: {lat: 36.16, lng: -115.10}})
		.then(json => {
			var location = json.results[0].geometry.location;
			console.log(location);
		})
		.catch(error => console.warn(error));

// Search by geo-location (reverse geo-code)
Geocoder.from(41.89, 12.49)
		.then(json => {
        		var addressComponent = json.results[0].address_components[0];
			console.log(addressComponent);
		})
		.catch(error => console.warn(error));

// Works as well :
// ------------

// location object
Geocoder.from({
	latitude : 41.89,
	longitude : 12.49
});

// latlng object
Geocoder.from({
	lat : 41.89,
	lng : 12.49
});

// array
Geocoder.from([41.89, 12.49]);

Error Codes

Name	Code	Description
NOT_INITIATED	0	Module hasn't been initiated. Call init function, and pass it your app's api key as parameter.
INVALID_PARAMETERS	1	Parameters are invalid.
FETCHING	2	Error wile fetching to server. The error's 'origin' property contains the fetch error.
PARSING	3	Error while parsing server response. The error's 'origin' property contains the response.
SERVER	4	Error from the server. The error's 'origin' property contains the response's body.

Release Notes

See CHANGELOG.md

react-native-geocoding's Issues

Billing for Google API

I'm doing something wrong or do I need to enable Billing on the Google Cloud Project to use this library now?

I'm getting this warning/error:

error_message: "You must enable Billing on the Google Cloud Project at https://console.cloud.google.com/project/_/billing/enable Learn more at https://developers.google.com/maps/gmp-get-started"

When trying to run this reverse geocoding code:

Geocoder.from(41.89, 12.49) .then(json => { var addressComponent = json.results[0].address_components[0]; console.log(addressComponent); }) .catch(error => console.warn(error));

Expected ':' in setApiKey method for IE browser

I getting Expected ':' in setApikey method when the application is running on IE browser.
Please let me know how to solve this error.

React Version: 16.3.1
react-native-geocoding : 0.2.0

Error while geocoding

It was working, but now I'm receiving this error:

message: Error from the server while geocoding. The received datas are in the error's 'origin' field. Check it for more informations.

  code: 4
  origin:Object 
    plus_code:Object 
      global_code:"4CW22222+22"
  results:Array(0) 
    length:0
  status:"ZERO_RESULTS"

Perhaps it's an error on Google's side?

Google API key restriction

Hello. How do you handle Google API Key restrictions ? I already added package name and SHA-1 and it seems that its not working. I still don't have access

Geocoding error " Attempt to invoke interface method 'java.lang.string.com.facebook.react.bridge.ReadableMap.getString(java.lang.String)' on a null object reference

Geocoder.from(41.89, 12.49)
.then(json => {
console.log("json",json);
var addressComponent = json.results[0].address_components[0];
console.log("addressComponent",addressComponent);
})
.catch(error => console.warn(error));

when I run the above code getting an error as " Attempt to invoke interface method 'java.lang.string.com.facebook.react.bridge.ReadableMap.getString(java.lang.String)' on a null object reference". Could you please help with this issue? Thanks.

Error while parsing response's body into JSON. The response is in the error's 'origin' field. Try to parse it yourself.

Hi I am getting this error while trying to get the address. Any soluttion

Error while parsing the response's body into JSON. The response is in the error's 'origin' field. Try to parse it yourself.

const getGeoLocation = (lat, long) => { // Geocoder.from(lat, long) Geocoder.from(37.78825, -122.4324) .then((json) => { console.log('json: ', json); const addressComponent = json.results[0].address_components[0]; console.log('addressComponent:', addressComponent); }) .catch((error) => console.log(error)); };

Is Init TS Error: return true since this function is always defined

isInit TS Error: return true since this function is always defined

There is a little bug in the TS definition because isInit is not a method, it is a getter so you cannot make Geocodoer.isInit() and when you do Geocoder.isInit TS fails

react-native-geocoding/index.d.ts

Line 46 in 55be82d

function isInit(): boolean;

No way to restrict API keys

Since this is done outside of NativeModules, one cannot restrict the API key, which is a huge security issue. If the api keys in use are intercepted everyone could use them and the bill would fall on us.

Is there a way to set language of returned address?

Working on simulator, not working on device

Hi, any reason of why Geocoder is working on iOS simulator but not in device?

On simulator I'm able to get the address from coordinates object. In production I have the next error:

But obviously I initialized the Geocoder:

useEffect(() => {
        initizalize()
        // removeData("@saved_locations")

    }, [])

    const initizalize = async () => {
        await Geocoder.init(config.Google_API, { language: "es" })
        Geolocation.setRNConfiguration(config2);
        handleUserLocation()
    }

My API key is right, as I said on simulator is workign perfectly but not on device.

*On device I have granted the location permissions.

How to get `State` name from `City` name

Is it possible to get the state name from city name?
If then, how to get the state name with city name.

Any help would be appreciated.

Thanks.

Is there a way to set the region where the geocoding is going to seach?

Hi,
I'm developing an app and I'm using this library to search coordinates by address.
in this section of the google documentation they say that if there are two address with the same name the region is the way to get an specific one.
you can see the documentation here: https://developers.google.com/maps/documentation/geocoding/intro?hl=pt#RegionCodes

is there a way to set the region? is setting the language equals to set the region?

Thanks for the library, it's really cool.

Change project name

Since this module only uses a fetch function, it's not only for react native but for any JS project. So it would be better to change the project name. Geocoder.js would be quite simple & straightforward.

how to " Error from the server. The error's 'origin' property contains the response's body."

Pls Help.

INVALID_REQUEST

I have error

{"code": 4, "message": "Error from the server while geocoding. The received datas are in the error's 'origin' field. Check it for more informations.", "origin": {"error_message": "Invalid request. Invalid 'latlng' parameter.", "results": [], "status": "INVALID_REQUEST"}}

Geocoder - "You have exceeded your daily request" but i just made 1 request ?!

Hi !
I have a problem, when I want to have a location there is this message : " You have exceeded your daily request" but i have just made 1 request ?
I don't understand ...
Thanks for help

Definie address type in reverse geocoding?

Thanks for the super simple, easy to use package. Is there any way to define the address type when doing a reverse geocoding request? In particular I'm hoping to get a street_address

See: https://developers.google.com/maps/documentation/javascript/geocoding#GeocodingAddressTypes

Try `npm install @types/react-native-geocoding` if it exists or add a new declaration (.d.ts) file containing `declare module 'react-native-geocoding';

Looks like after npm install types are not downloaded and vs code throwing error by saying unable to find types as

Try npm install @types/react-native-geocoding if it exists or add a new declaration (.d.ts) file containing `declare module 'react-native-geocoding';

how to fetch the country for a given zipcode

Hi,
I have a requirement to input the zip code and get the country name. Can you suggest me what is the input argument?

Raja K

Unable to get proper address

Is there a way to get proper and in separated fields from address, i am using react-native-geocoding to get address from lat and lng but the issue is i am not getting proper address means zip is missing some times and sometimes other fields.

I am using following code to extract details from this npm, do we have any better approach to extract data ?

const data = response?.results?.[0];


export const mapAddressFormatter = data => {
    let customData = { address: '' };
    customData.address = data?.formatted_address || '';
    customData.geometry = data?.geometry;
    data?.address_components?.forEach(item => {
        if (item.types.includes('country')) {
            customData.country = item.long_name;
        }
        if (item.types.includes('point_of_interest')) {
            customData.county = item.short_name;
        }
        if (item?.types?.includes('postal_code')) {
            customData.postalCode = item.short_name;
        }
        if (
            item?.types?.includes('street_address') ||
            item?.types?.includes('route') ||
            item?.types?.includes('sublocality_level_1') ||
            item?.types?.includes('sublocality_level_2') ||
            item?.types?.includes('sublocality_level_3') ||
            item?.types?.includes('sublocality_level_4') ||
            item?.types?.includes('sublocality_level_5')
        ) {
            customData.streetAddress = item.long_name;
        }
        if (item?.types?.includes('street_number')) {
            customData.streetNumber = item.long_name;
        }
        if (item?.types?.includes('administrative_area_level_1')) {
            customData.state = item.short_name;
        }
        if (item?.types?.includes('locality')) {
            customData.city = item.short_name;
        }
    });

    return customData;
};

I need following fields from this npm by providing lat and long:

• Main point of interest if any (like the company name)
• Street address
• City
• State
• Zip
• Complete human readable address

Note: I tried the famous places in my country but it doesn't return complete result.

ZERO_RESULTS during Geocode

When I enter an address for it to geocode it always shows zero_results regardless of what I put in.

{"code": 4, "message": "Error from the server while geocoding. The received datas are in the error's 'origin' field. Check it for more informations.", "origin": {"results": [], "status": "ZERO_RESULTS"}}

Update npm

When I installed this package from npm, it was like an old version. I had to install manually to get it to work properly.

geocoder.js file does not compile

I am actually using react-native-geocoding for my ReactJS app. Although I should not have used a native library for a ReactJS app, the code somehow works. While running the build script from the command line, an error message pops up saying that the geocoder.js file cannot be minified. Is there any solution this problem as I am trying to deploy my website to the server.

Any help would be greatly appreciated.

Property 'init' does not exist on type 'typeof Geocoder'.

Types are wrong configured, because there is a typescript warning in all methods but works

This IP, site or mobile application is not authorized to use this API key

I get this error:
code: 4
error_message: "This IP, site or mobile application is not authorized to use this API key. Request received from IP address 190.237.174.114, with empty referer."

RN version: 0.63.3
React-native-geocoding version: 0.5.0

Getting error code 2 in android production build.

I am using react-native-geocoding for reverse geo coding.

It was working fine in local .

But when i switch to production in android i am getting the error below.

import Geocoder from 'react-native-geocoding';
 Geocoder.init('key');
Geocoder.from(‘data’)
        .then((response) => {
      
        })
        .catch(error => {
    
        });

Response
{"code":2,"message":"Error while fetching. Check your network.","origin":{}}

is there any configuration i am missing.