Creating A Basic Google Map
From Fishcakes Wiki
Google Maps
- Fishcakes Google Maps Fishcakes API keys and research notes.
- Basic Google Map Creating a simple map with single point.
- Google Maps Guidelines Explaining the code and creating complex map with multiple points and overlays.
- Geocoding Google Maps How to guide to getting map point info from addresses.
- Google Map Domains International Google domains which support Maps.
- Google My Maps Tutorial to support Exponent Google Maps Simple module.
Creating a Basic Google Map
This page contains a guide to setting up a Basic Google Map.
Contents |
Basic Google Map
How to setup a very basic Google Map on your website. This is the HTML code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <script src="http://maps.google.com/maps?file=api&v=1&key=ABQIAAAAYBB_NyS1YelEH_91Z4JRxRTPO8D1fuP4Dvehrkb7tbDtd9g_0xTVWArpb3eavxmG2-67-ZM8bD7Geg" type="text/javascript"></script> <meta name="gmapkey" content="ABQIAAAAYBB_NyS1YelEH_91Z4JRxRTPO8D1fuP4Dvehrkb7tbDtd9g_0xTVWArpb3eavxmG2-67-ZM8bD7Geg" /> <script src="gmapez2.js" type="text/javascript"></script> </head> <body> <div class="GMapEZ GLargeMapControl GMapTypeControl GScaleControl" style="width: 400px; height: 400px;"> <a href="http://maps.google.co.uk/maps?f=q&hl=en&q=fishcakes+media&sll=51.531236,-0.131021&sspn=0.007195,0.014892&ie=UTF8&z=16&ll=51.532602,-0.130935&spn=0.007195,0.014892&om=1&iwloc=A"></a> </div> </body> </html>
The code in the HTML Head initialises the Google Maps API. The code in the HTML Body creates a DIV for displaying the Map.
-
Basic Google Map — Fishcakes Wiki Reference File.
Information about Advanced Google Maps functions such as externalising the API key, etc.
Storing Google Maps API Key in External PHP File
It's easiest to call the API key from an external file so you only have to enter it once on each site. 1. Find your root folder by inserting this code into an PHP map file:
Root = <?php echo $_SERVER['DOCUMENT_ROOT'] ?>
2. Save a file api_key_googlemaps.php to your root folder with the following code:
<?php $api_key = "YourApiKey"; ?>
3. Insert into the Header of your PHP Map file:
<?php include $_SERVER['DOCUMENT_ROOT'] . '/api_key_googlemaps.php'; ?>
4. Change your Google API script to:
<script src="http://maps.google.com/maps?file=api&v=2&key=<?php echo $api_key ?>" type="text/javascript"></script>
Google Maps Links
Official Google Maps Links
- Google Maps Home Page — official site.
- Get Google Maps API Key — you need a key for each domain or sub-domain on which you want to display maps.
- Google Maps API Documentation — concepts and examples.
- Google Maps API Reference — reference guide to all functions.
- Official Google Maps API Blog — good resource for finding out what's new.
- Google Maps Tour — find out what Google Maps can do.
- Google Maps User Guide — understanding how to use Google Maps.
- Google Mashup Editor Getting Started Guide — the place to start when making a Google Maps mashup.
Unofficial Google Maps Links
- Mapki Google Map Parameters — complete list.
- Mapki Get Latitude & Longitude — click for lat/lon.
- www.googlemapsbook.com — Google Maps Book website with blog, links and source code downloads.
- Google Maps Troubleshooting Group
- Integrating Google Maps into Your Web Applications — basic tutorial.
- Complete Google Maps Tutorial — rather techie but quite comprehensive tutorial from Mike Williams.
- List of Google Map Variables — quite useful.
Great Google Maps Sites
- Real Liverpool — excellent site with customised Google Maps.
- Charlottetown Transit Map — excellent Map with full source code available and tutorial on how to implement it.
Other Google Applications
- Google Trends — compare the world's interest in your favourite topics.
