CSC220 Homework 6 Solution 2010
--D. Thiebaut 19:28, 5 November 2010 (UTC)
Solution for Homework #6
Contents
Option 1
- In this approach, the two files showMap.htm and outputKml.php have been replaced by one program, now called showMap.php.
- In order to better pass information from the database to GoogleMaps, and to go around the caching that GGeoXml implements, the program works in the following fashion:
- It gets the Id that the user is interested and saves it in the $Id variable
- It fetches a KML file from the database at that $Id
- It stores the KML contents in a local file that is stored in a subdirectory called uploads, which is world-writeable (not very secure solution!)
- The name of that local file is made random by adding a random number to it (before the ".kml" extension). This will force GoogleMaps to load it, as it will never have it in its cache.
- GoogleMaps loads the file from a URL pointing to our own Website.
- The source code is below:
<?php
session_start();
?>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps API Example: GGeoXml KML Overlay</title>
<!-- =================================================================
J A V A S C R I P T
=================================================================
-->
<script src="http://maps.google.com/maps?file=api&v=2&key=xxxxxxxxxxxxxxxxxxx"
type="text/javascript"></script>
<script type="text/javascript">
var map;
var geoXml;
var toggleState = 1;
function initialize2() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById( "map_canvas" ) );
map.setCenter(new GLatLng( 42.32012788333333, -72.6431288999999 ), 11 );
map.setUIToDefault();
//map.addControl(new GLargeMapControl());
var exml;
exml = new EGeoXml( "exml", map, "uploads/dft.kml" );
exml.parse();
exml.show();
}
}
function initialize() {
if (GBrowserIsCompatible()) {
var url;
url = "http://cs.smith.edu/~220a/mysql/GoogleMaps/uploads/" + "<?php echo $_SESSION[ 'kmlFile' ];?>";
//alert( url );
geoXml = new GGeoXml( url );
map = new GMap2(document.getElementById( "map_canvas" ) );
map.setCenter(new GLatLng(42.32012788333333,-72.6431288999999), 11);
geoXml.gotoDefaultViewport( map );
map.setUIToDefault();
map.addControl(new GLargeMapControl());
map.addOverlay( geoXml );
}
}
function toggleMyKml() {
return;
if (toggleState == 1) {
map.removeOverlay(geoXml);
toggleState = 0;
} else {
map.addOverlay(geoXml);
toggleState = 1;
}
}
</script>
</head>
<?php
// ==================================================
// P H P
// ==================================================
//-----------------------------------------------------
// logit: logs information to a text file. Debugging
//-----------------------------------------------------
date_default_timezone_set( "America/New_York" );
function logit($msg){
$fp = fopen("log.txt","a+");
$msg = date("Y-m-d h:i:s a") . ": " . $msg;
fwrite($fp, $msg."\r\n");
fclose($fp);
}
//-----------------------------------------------------
//-----------------------------------------------------
function connectToMySql( ) {
include 'accessinfo.php';
$database = "220a_hw6";
//--- connect to mysql server ---
$link = mysql_connect( $hostName, $userName, $password );
if ( ! $link )
die( "Could not connect to server: " . $mysql_error() );
//--- select database ---
$database = "220a_hw6";
$db = mysql_select_db( $database, $link );
if ( ! $db )
die( "Could not connect to database " . $database . ": "
. mysql_error() );
return $link;
}
//-----------------------------------------------------
// getKml: get Kml file with Index $Id from database
//-----------------------------------------------------
function getKml( $link, $Id ) {
$query = sprintf( "SELECT `data` from `kmldata` WHERE `Id`='%s'", $Id );
$result = mysql_query( $query, $link );
if ( ! $result )
die( "Invalid query (" . $query . "): " . mysql_error() );
if ( $row = mysql_fetch_array( $result, MYSQL_NUM ) )
return $row[0];
return "";
}
$Id = $_REQUEST[ 'Id' ];
if ( ! isset( $Id ) ) {
?>
<body>
<FORM ACTION="showMap3.php" METHOD="POST">
KML File Id: <INPUT TYPE="text" NAME="Id" VALUE="" SIZE="5"><br />
<INPUT TYPE="SUBMIT" VALUE="Show Map!">
</FORM>
</body>
</html>
<?php
}
else {
logit( "Requested Id = $Id" );
//--- get kml data ---
$link = connectToMySql();
$kmlData = getKml( $link, $Id );
mysql_close( $link );
//--- store it to file ---
$fileName = sprintf( "dft_%d.kml", rand() );
$_SESSION[ 'kmlFile' ] = $fileName;
file_put_contents( "uploads/" . $fileName, $kmlData );
//--- open a body that loads up the map ---
?>
<body onload="initialize()">
<div id="map_canvas" style="width: 640px; height: 480px; float:left; border: 1px solid black;"></div>
</div>
<br clear="all"/>
<br/>
<FORM ACTION="showMap3.php" METHOD="POST">
KML File Id: <INPUT TYPE="text" NAME="Id" VALUE="" SIZE="5"><br />
<INPUT TYPE="SUBMIT" VALUE="Show Map!">
</FORM>
<br />
<input type="button" value="Toggle KML" onClick="toggleMyKml();" />
</body>
</html>
<?php
}
?>