CDarmangeat
CDarmangeat

Reputation: 11

Implementing Google Maps API Key in javascript

I am desperatly trying to put online a map I created through a Javascript code on a html page (I'm not a professional developper, and I am particulary ignorant in javascript). As long as I keep the html file local, everything runs ok, but as soon as I put it online, the map won't show, and I got a message concerning the missing key.

So I got a key, but my problem is to find how it works. My map is generated by the following instruction :

map = new google.maps.Map(document.getElementById("map"), options);

I tried to add this script :

script src="https://maps.googleapis.com/maps/api/js?key=#####&callback=initMap" async defer

But all that happens is several more errors, and no map visible.

Could anyone help me ? Thanks in advance

Upvotes: 1

Views: 1403

Answers (2)

Karlen
Karlen

Reputation: 1394

Go to credentials page in google developer console then at the top you will see Domain Verification tab click on that tab, then click on the button Add domain in order to add the domain from where your site is being loaded.

If you do this you will not need API key. Thanks to this Google can track your requests.

Important Note

I'm not sure whether this will be the case for you but please note that once you will add a verified domain make sure that the previously generated your key is not being used for the Google Map's web services like APIs otherwise that APIs will return error after adding domain.

Upvotes: 0

ca1c
ca1c

Reputation: 1295

Instead, you should use an iframe that you get on the google maps site. Example:

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d100994.00356082054!2d-121.9805740058651!3d37.71820818113972!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x808fe65cd6892231%3A0x3b327c848ef64057!2sDublin%2C+CA+94568!5e0!3m2!1sen!2sus!4v1480970198759" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

Upvotes: 0

Related Questions