Getting a 610 error response from Google lately? Perhaps you have a bad API key? Not really it actually might be because Google deprecated support for their API V2…
Want to learn how to make a responsive google map for your site using PHP & HTML5 on API 3? here is how…
Note: In API V3 you do not require or use an api key.
Objectives:
Create a quick solution to produce responsive HTML5 Google Maps on the fly.
- write HTML
- write CSS
- write php/curl function
- example of use
- sample
First we will begin with a quick HTML wrapper and to place our iframe in…
[cc lang=”html”]
[/cc]
Use CSS to control the iframe and wrapper, this will also keep iframe in widescreen/16:9
[cc lang=”css”]
.wrapper
{
height: 0;
padding-bottom: 56.25%; /* 16: 9 */
position: relative;
width: 100%;
margin: 0;
overflow: hidden;
}
iframe
{
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
border: 0;
overflow: hidden;
}
[/cc]
Now lets create the function that will generate a iframe tag on the fly by simply passing 1 value… an address
[cc lang=”php”]
# google map iframe generation
function gMap($a)
{
// setting up vars
$lat = ”;
$lon = ”;
$addr = $a;
$addr = urlencode($addr);
$u=”http://maps.googleapis.com/maps/api/geocode/json?address=”.$addr.”&sensor=false”; // URL
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $u);
curl_setopt($ch, CURLOPT_HEADER,0);
curl_setopt($ch, CURLOPT_USERAGENT, $_SERVER[“HTTP_USER_AGENT”]);
// Comment out the line below if you receive an error on certain hosts that have security restrictions
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
$d = curl_exec($ch);
curl_close($ch);
$g = json_decode($d, true);
// Debugging Purposes… or if you wanna use additional data…
//echo ‘
'; //print_r($g); //echo '
‘;
// If the Json request was successful…
if ($g)
{
$lat = $g[‘results’][0][‘geometry’][‘location’][‘lat’];
$lon = $g[‘results’][0][‘geometry’][‘location’][‘lng’];
$m = ‘‘;
echo $m;
} else {
echo ”
No Map Available
“;
}
}
[/cc]
Our php then goes inside the div
[cc lang=”php”]
< ?php // you can insert a var instead of string if you wish ex: gMap($address) gMap('48034 Rancho Way Temecula CA, 92592'); ?>
[/cc]
An example of a running script
[cc lang=”php”]
< ?php
# google map iframe generation
function gMap($a)
{
// setting up vars
$lat = '';
$lon = '';
$addr = $a;
$addr = urlencode($addr);
$u="http://maps.googleapis.com/maps/api/geocode/json?address=".$addr."&sensor=false"; // URL
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $u);
curl_setopt($ch, CURLOPT_HEADER,0);
curl_setopt($ch, CURLOPT_USERAGENT, $_SERVER["HTTP_USER_AGENT"]);
// Comment out the line below if you receive an error on certain hosts that have security restrictions
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
$d = curl_exec($ch);
curl_close($ch);
$g = json_decode($d, true);
// Debugging Purposes... or if you wanna use additional data...
//echo '
‘;
//print_r($g);
//echo
;
// If the Json request was successful…if ($g)
{
$lat = $g[‘results’][0][‘geometry’][‘location’][‘lat’];
$lon = $g[‘results’][0][‘geometry’][‘location’][‘lng’];
$m = ‘‘;
echo $m;
} else {
echo ”No Map Available
“;
}
}?>
< ?php // you can insert a var instead of string if you wish ex: gMap($address) gMap('48034 Rancho Way Temecula CA, 92592'); ?>[/cc]
Let me know if you have any questions. :)
