why google maps example are not displayed? - javascript

Could you please tell me why google maps example are not displayed ?
Here is my code
https://tomchentw.github.io/react-google-maps/#introduction

They did some changes to the map api a while back, think you have to pay to use it now
One of the main reasons Google Maps stopped working on your site may
be the changes in Google policies concerning the work of Google Maps,
announced on 16 July. More specifically, from now on to display Google
Maps on your website you need to get a Google Maps API key. This is a
kind of token, connecting your widget and Google Maps API Ref
Cant find a date for the link you provided but i guesse it was posted before 16 July

Related

2018 This page can't load Google Maps correctly

Sounds like duplicate? but no, this is happened since a week ago for all websites in the world that used google maps API, even I searched in google: google maps api js fiddle:
http://jsfiddle.net/salman/4mtyu/
https://jsfiddle.net/user2314737/x4gM4/
https://jsfiddle.net/user2314737/2d5qum53/
http://jsfiddle.net/chufol/T78Hd/
https://jsfiddle.net/user2314737/36tgzztv/
See? none of them working, all got message from google:
This page can't load Google Maps correctly
I searched in Stack Overflow, all topics are old and not solve this problem. But look like google need to an api key to work, right?
So in my web site I have api key but I got this error:
Google has disabled use of the Maps API for this site.
And there is a link to enable google maps api, but after I enable api key, still have same error, any solution?
Take a look at this maps didn't load correctly.
This error has become a lot more common since Google Maps started requiring an API key on June 22, 2016 (after about 10 years of allowing keyless use). If you started using Google Maps on your website on or after that date then you will need to sign up for and implement an API key (older users still do not need a key).
Also, You must now enter your billing information in the Console.
Here is official Google guide.
To use the Maps JavaScript API, you must get an API key which you can then add to your app or website. The API key is used to track API requests associated with your project for quota, usage, and billing. To learn more about API keys, see the API Key Best Practices and the FAQs.

Verified SAB do not get returned through Google Places API Web Service or even the Google Maps Javascript API

We have tried using the Google Places API on iOS and Google Places Web Service to get a verified SAB (service area business), that is a business that has an address but that does not have a physical location, rather it serves a certain area.
Here is an example business "Japanese Mobile Hairdresser Scissor Paper Rock" that you can try.
After trying nearby, textsearch, autocomplete and other APIs we came to the conclusion that because there is no physical address and the business actually just serves an area it makes sense that the Google Places API does not return this business or any other SAB.
Using Google Maps directly though does return the business and so does the sample that Google has on this page about the js API
https://developers.google.com/maps/documentation/javascript/examples/places-placeid-finder
Also searching around on the internet you will find articles like this
https://productforums.google.com/forum/#!topic/map-maker/0-0wplytssg
that seem to suggest that although SABs will not show on a map they will return in the search results of a map as the above sample suggest and also using Google Maps directly.
Logically then we tried to create a web page that uses the js API example to see if we can search for the "Japanese Mobile Hairdresser Scissor Paper Rock" business only to find out that although it gets returned by Google's sample when we add our API key and host that file on a server neither this business nor any other SAB gets returned.
Has anyone else experienced this problem? Is there any way to get SABs by using any of the available APIs from Google, whether it is Google Maps or Google Places or any other? Do you know if Google returns different results on their maps rather than the APIs?
FYI all these APIs are enabled on the Google Console API
Google Places API for iOS
Google Places API Web Service
Google Maps SDK for iOS
Google Maps JavaScript API
Google Maps Geocoding API
Any help would be greatly appreciated.

Rails using Google Places web API (key not working)

I am trying to use Google Places address autocomplete in a rails app.
I am using this example from google and trying it out on JSFiddle works fine. I change to my API Key and then doesnt work.
I tried in my rails app in development and in production getting the same result.
As soon as i write something the text box freezes and a little 'i' appears. (not clickable)
I created and tried 'browser api key' and 'server api key' with no luck.
I set my domain as requested * .mydomain.com/* and it didnt work
I enabled
- Google Maps JavaScript API
- Google Static Maps API
- Google Maps Embed API
- Google Places API Web Service
- Google Maps Geocoding API
- Google Maps Geolocation API
I added to my layout/application.html.erb file
I am searching through all questions but cant find my case, please help me find a solution or point me in the right direction. Thanks!
Update: In browser console i see
Google Maps API error: RefererNotAllowedMapError https://developers.google.com/maps/documentation/javascript/error-messages#referer-not-allowed-map-error
Your site URL to be authorized: 'mysite'
I have authorized the link exactly as shown in console but its not accepting it.
Solved.
I somehow managed to mix up my API keys in loading 1.&libraries=places and in
2.=initAutocomplete" while I was authorizing my url.
thanks to all specially to #power for reminding me to check the console logs. I know its dumb, but I keep forgetting...

Check Connectivity to Google Maps API (China Great Firewall)

I'm currently working on a platform that will be launched all over the world and I am working in Shanghai China and as you might know there is a very big Firewall policy here.
The site contains a custom map view created with the Google Maps API this is because Google allows a lot of nice features to change the look and feel of the map.
But now I'm running into a problem where if a user wants to access the site without VPN the whole page where the map is located slows down,crashes and breaks my login procedure.
Here are the errors showing in the Console View:
GET https://maps.googleapis.com/maps/api/js?key=1010101010101&sensor=true net::ERR_CONNECTION_TIMED_OUT
Uncaught ReferenceError: google is not defined
I want to know if there is a way to check if I have a connection to the Google Maps API before executing the code?
Cheers,
Koen
Checking if the API is loaded, as Keith links above, is a good way to see if the loading has had any trouble.
To minimize problems loading the API in China the Maps API FAQ recommends loading the API from http://maps.google.cn/maps/api/js and not using https.

What's the API Key for in Google Maps API V3?

In the older version of the API, I'd have to insert the javascript into the page using something like this for just basic functionality to work:
http://maps.google.com/maps?file=api&v=2&key=GoogleMapsAPIKey
Where I had to configure the API key for each individual site. Looking at the documentation, it says to get a basic map working I just need this:
http://maps.google.com/maps/api/js?sensor=true/false
Where does the API key fit in? Do I need to worry about it if I just plan on using a basic map and marker and none of the more advanced functions?
I'm also testing on localhost, but the FAQ says I still need to register a key for it, which I haven't done and it still works.
Whilst it is true that V3 of the Google Maps API does not require an API key, it is there for a reason. Google recently introduced the following usage limits:
Web sites and applications using each of the Maps API may at no cost
generate:
up to 25,000 map loads per day for each API
up to 2,500 map loads per day that have been modified using the Styled Maps feature
In order to monitor usage an API key is necessary, as the developer notes make clear:
All Maps API applications should load the Maps API using an API key.
Using an API key enables you to monitor your application's Maps API
usage, and ensures that Google can contact you about your application
if necessary. If your application's Maps API usage by exceeds the
Usage Limits, you must load the Maps API using an API key in order to
purchase additional quota.
So whilst you don't need to have an API key it is useful if you want to monitor your usage and also required if you buy additional usage quota.
V3 of the Google Maps API does not require an API key. So you're good to go.
Edit: In the time since I answered this question Google released support for API keys in v3, letting you see usage of your API site in Google's developer console. The original answer is still accurate: API keys are not required, but they are now recommended.
As of June 22, 2016 Google Maps V3 no longer supports keyless access so you need to get a key for every (referrer-)domain which has never had a Google Map on it before.
Get your key here: https://developers.google.com/maps/documentation/javascript/get-api-key
and append it to the URL of the script like so:
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY" type="text/javascript"></script>
If you do not provide an API key you will see this warning instead of your rendered map:
and your browser's console will tell you the reason:
Google Maps API error: MissingKeyMapError https://developers.google.com/maps/documentation/javascript/error-messages#missing-key-map-error
Under Google Map's Api's choose Google Maps JavaScript API
Enable the Api.
Go to credentials section.Choose create Credentials.
choose API Key from the popup,and then choose browser key from the proceeding popup.
.
6.Replace the YOUR_API_KEY with your own api key obtained
You can't use google maps in Android app unless you create a google map key. You need to use keytool to generate MD5 and use that to generate google map key on google map website. keytool should be located on your computer where you have sdk installed. I have generated developer google map key, and I have noticed that key is only good for developing Android app on that particular computer. If you are going to develop Android app on an another computer then you need to generate another google map key for that computer. If you don't see a google map on your Android app but rather you see a grid, this could mean that your google map key is invalid.

Categories

Resources