Ilmukuilmumu

Amalkan apa yang telah kau pelajari, karena itulah sesungguhnya ilmu yang kau miliki

GoogleMap API

on June 14, 2010

Mengembangkan aplikasi Web Menggunakan GoogleMap API

Setelah beberapa lama saya mencari script untuk memanfaatkan fasilitas Google Map akhirnya saya mendapatkan juga. tidak berfikir panjang lebar lagi saya langsung mencobanya. berikut scrip yang saya buat :

index.php

<script src=”http://maps.google.com/maps?file=api&v=2&key=your gmap api key here”
type=”text/javascript”>
</script>
<html>
<head>
<title> Google Map </title>
</head>

<body>
<center>
<form name=”form1″ method=”post” action=”index.php”>
<table width=”268″ border=”0″>
<tr>
<td width=”97″>Nama Jalan </td>
<td width=”161″><input name=”txt_1″ type=”text” id=”txt_1″></td>
</tr>
<tr>
<td>Kabupaten</td>
<td><input name=”txt_2″ type=”text” id=”txt_2″></td>
</tr>
<tr>
<td>Negara</td>
<td><input name=”txt_3″ type=”text” id=”txt_3″></td>
</tr>
<tr>
<td>&nbsp;</td>
<td><label>
<input name=”btn_ok” type=”submit” id=”btn_ok” value=”Tampilkan Peta”>
</label></td>
</tr>
</table>
</form>
<?php

if (isset($_POST[‘btn_ok’]))
{
echo $address = $_POST[‘txt_1′].’, ‘.$_POST[‘txt_2′].’, ‘.$_POST[‘txt_3’];
}

$KEY = “Google Key Here”;
$MAPS_HOST = “maps.google.com”;
$delay = 0;
$base_url = “http://&#8221; . $MAPS_HOST .”/maps/geo?output=xml” . “&key=” . $KEY;
$geocode_pending = true;
//$address = “Palasah, Majalengka, Indonesia”;
while($geocode_pending)
{
$request_url = $base_url . “&q=” . urlencode($address);
$xml = simplexml_load_file($request_url) or die(“url not loading”);
$status = $xml->Response->Status->code;
if (strcmp($status, “200”) == 0) {
// Successful geocode
$geocode_pending = false;
$coordinates = $xml->Response->Placemark->Point->coordinates;
$coordinatesSplit = split(“,”, $coordinates);
// Format: Longitude, Latitude, Altitude
$lat = $coordinatesSplit[1];
$lng = $coordinatesSplit[0];
$latlonArr[‘lat’] = $lat;
$latlonArr[‘lon’] = $lng;

} else if (strcmp($status, “620”) == 0) {
// sent geocodes too fast
$delay += 100000;
} else {
// failure to geocode
$geocode_pending = false;
}
usleep($delay);
break;
}
//plot map
$str =  ‘<script>
var map = new GMap2(document.getElementById(“map”));
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addControl(new GScaleControl());
map.setCenter(new GLatLng(‘.$latlonArr[‘lat’].’, ‘.$latlonArr[‘lon’].’), 15);

// Creates a default marker whose info window displays the given number
function createMarker(point, number)
{
var marker = new GMarker(point);
// Show this markers index in the info window when it is clicked
var html = number;
GEvent.addListener(marker, “click”, function() {marker.openInfoWindowHtml(html);});
return marker;
};’;
$str .= “var point = new GLatLng(” . $latlonArr[‘lat’] . “,” . $latlonArr[‘lon’] . “);\n”;
$str .= “var marker = createMarker(point, ‘” . addslashes($address).”‘);\n”;
$str .= “map.addOverlay(marker);\n”;
$str .= “</script>\n”;
?>
<div id=”map” style=”width: 500px;height:400px”></div>
<?php
// plot the map with default marker icon
echo $str;
?>
</center>
</body>
</html>

untuk mencoba scrip tersebut, komputer harus terhubung dengan internet secara online. ^_^

smoga bisa menjadi tambahan ilmu bagi teman teman.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: