Creating Databases Example using Google Maps API + file creation. Dollar sign problem. Classwork/Homework: [catch up]. Work on final project
Google Maps example Challenge: create list of positions defining polygon(s) for a quiz (or something else) Solution: – Create.html and.php pair of scripts to create file – Create drawing program using the file created. Recreates inserting name of file Note: student's project will still need work on file, namely combining multiple files into one.
Scripts eyer/createFileOfLocations.html eyer/createFileOfLocations.html This creates a file with the name specified by the user. The following file has a file name hard coded in it: eyer/drawpolygon2.html eyer/drawpolygon2.html
About the html file Mouse clicks on map add to an array A form invokes a client side function "sendit()" using onsubmit and then the server side writeoutlatlongs.php using action The form also requests a name for the file.
Html script var map; var redx = "rx1.png"; function init() { blatlng = new google.maps.LatLng( , ); myOptions = { zoom: 17, center: blatlng, mapTypeId: google.maps.MapTypeId.SATELLITE }; map = new google.maps.Map(document.getElementById("place"), myOptions); listener = google.maps.event.addListener(map, 'click', function(event) { checkit(event.latLng);}); }
Html script, cont. var elements = []; var markersArray = []; function sendit() { var data = elements.join(':'); //alert("in sendit, data is "+data); document.f.positions.value = data; return false; } function checkit(clatlng) { lastmarker = clatlng; marker = new google.maps.Marker({ position: clatlng, icon: redx, map: map }); markersArray.push(marker); pos = "["+String(clatlng.lat())+", "+String(clatlng.lng())+"]"; elements.push(pos); //alert("position is "+pos+" and number of elements is "+elements.length); }
Html script, cont.: body Mark polygon When done inserting points, accept or enter name of area to be used as file name and click on Done. Your name for the polygon
php script <?php $newname = $_GET['subject']; $positions = $_GET['positions']; $filen ="uploads/". $newname. ".js" ; $open = fopen($filen,"w"); print (" Saving positions in $filen "); //explode into array $positions = explode(":",$positions); //now write out each pair as line in file $open = fopen($filen,"w");
php script, cont. if ($open) { fwrite($open,"var positions = [ \n"); for($i=0;$i<count($positions)-1;$i++) { fwrite($open,$positions[$i].",\n"); } fwrite($open,$positions[$i]."\n "); // omit comma after last element fwrite($open,"]; \n"); fclose($open); } else { print (" Unable to write updated file. "); } ?>
myplace.js var positions = [ [ , ], [ , ], [ , ], [ , ], [ , ] ];
Draw script You can view source. on2.html on2.html Makes use of Google Maps API google.maps.Polygon and google.maps.Infowindow Robust system could include facility for editing positions.
What if… CTS assigned you a password with a dollar sign in it. Two solutions (say password was abc$def – Use single quotes: $password = ‘abc$def’ – Escape character: $password = “abc\$def’ Can use this in other situations. eyer/dollartest.php eyer/dollartest.php
<?php $stringWdollar = 'abc$def'; print ("string with single quotes ".$stringWdollar); print(" "); $stringWdollarescaped = "abc\$def"; print ("string with dollar sign escaped ".$stringWdollarescaped); print (" "); $stringWdollarescapedsinglequotes = 'abc\$def'; print ("string with dollar sign escaped, single quotes ".$stringWdollarescapedsinglequotes); print (" "); $stringWdollarplain = "abc$def"; print ("string with dollar, double quotes ".$stringWdollarplain); ?>
Classwork/homework [Catch up with postings, showing work.] [Evaluation surveys.] Prepare to show something on final project.