Network Programming Wikiclass | Tutorial / Google Maps Geocoding API

Overview: In this tutorial, you will study how to use PHP to access the Google Maps Geocoding API.

Activity One: Google Maps Geocoding API V3

References: http://code.google.com/apis/maps/documentation/geocoding/

The Google Geocoding API has been significantly upgraded and enhanced. The newest version of the Geocoding API is V3. The legacy Geocoding API V2 has been deprecated. Users of that service should upgrade to this version. The new Google Geocoding API no longer requires a Maps API key!

Study the following script. Answer the questions that follows.

$base_url = 'http://maps.googleapis.com/maps/api/geocode/json?sensor=true&';

$request_url = $base_url."address=".urlencode($address_chi);

//$request_url = $base_url."address=".urlencode($address_eng);

$json = file_get_contents($request_url);

$j_array = json_decode($json,true);

$r_array = $j_array['results'];

$address_en = $r_array[0]['formatted_address'];

$lat = $r_array[0]['geometry']['location']['lat'];

$lng = $r_array[0]['geometry']['location']['lng'];

$result_valid = true;

if($address_en=='Hong Kong') $result_valid = false;

if(strlen($address_en) < 20) $result_valid = false;

if($result_valid) {

        //you can use lat and lng to proceed

} else {

  $lat = 0.0;

  $lng = 0.0;

}

[Get Code]

Q1: Write the general form of a Google's Geocoding API request.
Q2: What is the response format of the above request?
Q3: What is the function of file_get_contents()?
Q4: What is the function of json_decode()?

Activity Two: Use Google Maps Geocoding API

Add the above code segment into the following web page so that it can function properly.

<?php

$search = strip_tags(trim($_GET['s']));

$has_input = false;

if ($search != '') {

        $place = $search;

        $has_input = true;

        //find lat and lng from the place name

        $lat = 0.0; $lng = 0.0;

        $latlng = $lat.','.$lng;

        //search photos from the lat and lng

}

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Test Web Service API with PHP</title>

<style type="text/css" media="screen">

body {text-align:center; font-family:Georgia, "Times New Roman", Times, serif;}

img {margin:5px;border:2px solid #555;}

.imageDisplay {margin:auto;width:500px;}

.imageDisplay a {text-decoration:none;}

#searchwrapper {

width:338px; /*follow your image's size*/

height:59px;/*follow your image's size*/

background-image:url(search_bg.png);

background-repeat:no-repeat; /*important*/

padding:0px;

margin:0px auto 20px;

position:relative; /*important*/

}

#searchwrapper form { display:inline ; }

.searchbox {

border:0px; /*important*/

background-color:transparent; /*important*/

position:absolute; /*important*/

top:15px;

left:15px;

width:256px;

height:28px;

}

.searchbox_submit {

border:0px; /*important*/

background-color:transparent; /*important*/

position:absolute; /*important*/

top:4px;

left:265px;

width:48px;

height:48px;

}

</style>

</head>

<body>

<h1>S212 A2: Photo Search</h1>

<div id="searchwrapper">

<form action="">

<input type="text" class="searchbox" name="s" value="" />

<input type="image" src="THE_BLANK_SUBMIT_BUTTON_IMAGE" class="searchbox_submit" value="" />

</form>

</div>

<?php if($has_input) { ?>

<p><strong>Search Term: <?php echo $place; ?></strong></p>

<p><strong>Location: <?php echo $latlng; ?></strong></p>

<a href="#" title="">

<img src="http://maps.google.com/maps/api/staticmap?center=<?php echo $latlng; ?>&zoom=13&markers=color:red|label:H|<?php echo $latlng; ?>&size=500x300&sensor=false" width="500" height="300" alt="" /></a>

<?php } else { ?>

<p><strong>Please input something to start search!</strong></p>

<div class="imageDisplay">

<?php for ($count=0;$count<18;$count++) { ?>

<a href="#" title=""><img src="http://placehold.it/60x60" width="60" height="60" alt="" /></a>

<?php } ?>

</div>

<?php } ?>

</body>

</html>

[Get Code]

Submission

Please submit your work to Steven by email: sochoy@ouhk.edu.hk.
Please use SXXXXXXX - NP Tutorial 22 Submission as the email subject.