How to get Google Maps API Key?

Your map suddenly stopped working and you get the following error?

Oops! Something went wrong.
This page didn’t load Google Maps correctly. See the JavaScript console for technical details.

Please check you browser console, if you’ll see such error This site has exceeded its daily quota for maps. – this article is written for you and required for reading.

Since December 19, 2018 – Google Maps Maps JavaScript API was updated to the v3. It was written with a focus on modern JavaScript programming techniques, also API was simplified and increased use of libraries. Now it includes following such changes:

  1. A streamlined core library. Many of the supplementary functions have been moved into libraries, helping to reduce the load and parsing times for the Core API which lets your map load quickly on any device.
  2. Improved performance of several features, such as polygon rendering and marker placement.
  3. A new approach to client-side usage limits to better accommodate shared addresses used by mobile proxies and corporate firewalls.
  4. Added support for several modern browsers and mobile browsers. Support for Internet Explorer 6 has been removed.
  5. Removed many of the general-purpose helper classes ( GLog or GDownloadUrl). Today, many excellent JavaScript libraries exist that provide similar functionality, such as Closure or jQuery.
  6. An HTML5 Street View implementation that will load on any mobile device.
  7. Custom Street View panoramas with your own photos, allowing you to share panoramas of ski slopes, houses for sale or other interesting places.
  8. Styled Maps customizations that allows you to change the display of elements on the base map to match your unique visual style.
  9. Support for several new services, such as the ElevationService and Distance Matrix.
  10. An improved directions services provides alternative routes, route optimization (approximate solutions to the traveling salesperson problem), bicycling directions (with bicycling layer), transit directions, and draggable directions.
  11. An updated Geocoding format that provides more accurate type information than the accuracy value from the Geocoding API v2.
  12. Support for multiple Info Windows on a single Map. 

Here you can get more information about all updates. Also please check all Maps JavaScript API Usage and Billing.

The Maps JavaScript API is no longer supported, therefore you may encounter with a problem which described above. In order to protect yourself, you need to migrate the code to Maps JavaScript API v3. This guide is intended to help you with migration.

How to upgrade your application?

First of all, Maps JavaScript API v3 has another key system, so v2 keys key will not work after the migration. You need to generate new keys.

Generating API keys: a quick guide

  1. At first, you need to create a Gmail Account and log in to it.
  2. Then follow this link and you will be redirected on the Google Cloud. Select the “Maps” option.Google Cloud
  3. Set up the project name.project name
  4. If you do not have billing accounts, Google will ask you to create it. So, fill all the fields. In order you have it, jump to the next step. Note, according to a Google policy, you will automatically charged only when you reach your billing threshold or 30 days after your last automatic payment, whichever comes first. Firstly, Google gets a 12-month free trial period and $200 credits. billing accounts
  5. Create a new project: enter the name and location.name and location
  6. The last step – enable your APIs by clicking the “NEXT” button. enable your APIs
  7. Done! Your generated API key will appear in the window. generated API key

Loading the API

There are some changes in the way you load your API:

  1. Load the API from //maps.googleapis.com/maps/api/js, NOT FROM http://maps.google.com/maps
  2. Remove the file parameter.
  3. Update the key parameter with your new v3 key. Google Maps APIs for Work customers should use a client parameter.
  4. (Google Maps APIs Premium Plan only) Ensure that the client parameter is supplied as explained in the Google Maps APIs Premium Plan Developer’s Guide.
  5. Remove the v parameter to request the latest released version or change its value accordingly to the v3 versioning scheme.
  6. (Optional) Replace the hl parameter with language and preserve its value.
  7. (Optional) Add a libraries parameter to load optional libraries.

Adding google.maps namespace

As you remember, the v2 API places all objects in the Global namespace by default. This has resulted in naming collisions. Therefore, v3 from now locates all objects within the google.maps namespace.

You have to change the code to make use of the new namespace during the migration/ The rule is simple: instead of “G”, you have to write “google.maps”, like in the example below.

GMap2 – google.maps.Map

Removing Obsolete Code

v3 doesn’t support some of the classes. So, you need to replace them. There are two ways:

  • By using the library, such as Closure or jQuery
  • Make it manually.

Replace these classes.

classes

Summary

Read more about our Google Maps solution and enjoy our Demos. If you’ll face another problem with WordPress Google Maps Easy plugin or you’ll have some questions – don’t hesitate to contact us through our internal support. We will be glad to help you.

Also, we want to remind you about some changes made by Google in their price policy this summer. Read about it carefully (or you have all chances to repeat our fail).  Nevertheless, you can always try others alternatives with our Ultimate maps plugin.

Categories
Related Articles
Latest Articles
Get plugins bundle today and save over 80%