How to Integrate With Google Maps
Google Maps is a web mapping service that is free for non-commercial use. It powers many map services on the Internet, including websites integrated with Google Maps through the Google API. Powered by an extensive database, Google Maps allows users to get directions between locations, view satellite images and look at street views. Through the Google API, developers can integrate their websites with this service to provide customized mapping programs and applications tailored to the needs of their customers and visitors.
Instructions
-
Get the API Key
-
1
Learn about usage rules at google.com/apis/maps/signup.html. Developing map applications with the Google API is free, with no page view or requests limits, as long as the developed product is provided free to end-users.
-
2
Read the Google API Terms and Conditions at google.com/apis/maps/signup.html. Google uses your unique API key to track anonymous usage statistics and can impose limitations on the requests made by your key at any time.
-
-
3
Click the checkbox next to "I have read and agree with the terms and conditions," enter your website URL and click "Generate API Key."
-
4
Save the generated API key in a text file and keep it in a safe location. You will need it for every script you write to integrate Google Maps.
Create a Script
-
5
Create a new text file using your preferred text editor. Incorporating a Google map into your website requires just a few lines of code.
-
6
Type the following into your text file:
<script src="http://maps.google.com/maps?file=api&v=1 &key=ADD_YOUR_KEY_HERE" type="text/javascript">
</script>
Be sure to replace "ADD_YOUR_KEY_HERE" with the API key you received.
-
7
Save and upload the file to your public web server. For Google Maps to work properly, it must be able to communicate with the online mapping service.
-
1
Tips & Warnings
The Google API is updated periodically, so you should keep up to date with it to ensure that your application continues to function.
References
- Photo Credit Sea maps series: Red Sea image by Stasys Eidiejus from Fotolia.com