Ciao ragazzi,
Avrei un progetto e chiedo il vostro aiuto per portarlo a termine. Vorrei usare le mappe di google per seguire lo spostamento di un oggetto volante non identificato in tempo reale sul una pagina web. Ogni persona potrà,se munita della password,cliccare sulla zona della mappa di google dove si presume lo abbia visto e mettere un segnaposto. Ho gia' trovato lo script,che allego qui,quello che non so' fare e' salvare le coordinate su un database MYSQL e creare una pagina dove venga immessa una password che permetta solo alle persone autorizzate di mettere il segnaposto. Spero che non sia per voi troppo complicato. Grazie.
codice:<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta name="author" content="Mario" /> <meta name="generator" content="route" /> <script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAqlD-Bzwo0trckk-cerPomRTXL_lyxiMaDqVb5tHx0dM1LGtuuBTXGN3iuo32rS_Q4xV_O2qMPktF7A" type="text/javascript"></script> </head> <body onload=load() onunload="GUnload()"> <input type="button" onclick="deleteLastPoint();" value="Delete Last Point"/> <input type="button" onclick="clearMap();" value="Clear Map"/></p> </div> <div id="digimapbox" style="padding-top:5px;height: 410px;width: 780px;"> <div id="map" style="float:left;width: 495px; height: 400px"></div> <div id="status" style="float:right; width:275px; height: 400px;"> <textarea id="coords" cols="30" rows="24" readonly="true" onclick="this.select();">Click on the map to start drawing a line</textarea> </div> </div> <script type="text/javascript"> //<![CDATA[ var map; var polyShape; var polygonMode; var polygonDepth = "20"; var polyPoints = []; var marker; var geocoder = null; var fillColor = "#0000FF"; // blue fill var lineColor = "#000000"; // black line var opacity = .5; var lineWeight = 4; var kmlFillColor = "7dff0000"; // half-opaque blue fill function load() { if (GBrowserIsCompatible()) { map = new GMap2(document.getElementById("map")); map.setCenter(new GLatLng(43.23920036180898, 13.75213623046875), 9); map.addControl(new GSmallMapControl()); map.addControl(new GMapTypeControl()); map.addMapType(G_PHYSICAL_MAP); GEvent.addListener(map, 'click', mapClick); geocoder = new GClientGeocoder(); } } // mapClick - Handles the event of a user clicking anywhere on the map // Adds a new point to the map and draws either a new line from the last point // or a new polygon section depending on the drawing mode. function mapClick(marker, clickedPoint) { //polygonMode = document.getElementById("drawMode_polygon").checked; // Push onto polypoints of existing polygon polyPoints.push(clickedPoint); drawCoordinates(); } // Clear current Map function clearMap(){ map.clearOverlays(); polyPoints = []; document.getElementById("coords").value = "Click on the map to start drawing a line"; } // Delete last Point // This function removes the last point from the Polyline/Polygon and redraws // map. function deleteLastPoint(){ map.removeOverlay(polyShape); // pop last element of polypoint array polyPoints.pop(); drawCoordinates(); } // drawCoordinates function drawCoordinates(){ //Re-create Polyline/Polygon if (polygonMode) { // polyShape = new GPolygon(polyPoints,lineColor,lineWeight,opacity,fillColor,opacity); polyShape = new GPolyline(polyPoints,lineColor,lineWeight,opacity); } else { polyShape = new GPolyline(polyPoints,lineColor,lineWeight,opacity); } map.clearOverlays(); // Grab last point of polyPoints to add marker marker = new GMarker(polyPoints[polyPoints.length -1]); map.addOverlay(marker); map.addOverlay(polyShape); // logCoordinates(); } // logCoordinates - prints out coordinates of global polyPoints array // This version only logs KML, but could be extended to log different types of output function logCoordinates(){ //var header = "var linecolor=\'" + lineColor + "\'; " + // "var lineweight=\'" + lineWeight + "\'; " + // "var lineopacity=\'" + opacity + "\'; " + // "var gpline=new GPolyline(["; // check mode if (polygonMode){ //header += "<Polygon><extrude>1</extrude>\n<altitudeMode>relativeToGround</altitudeMode>" + // "<outerBoundaryIs>\n<LinearRing>\n<coordinates>\n"; //var footer = "</coordinates></LinearRing></outerBoundaryIs></Polygon></Placemark>\n</Document>\n</kml>"; var header = "var linecolor=\'" + lineColor + "\'; " + "var lineweight=\'" + lineWeight + "\'; " + "var lineopacity=\'" + opacity + "\'; " + "var gpline=new GPolyline(["; var footer = "],linecolor,lineweight,lineopacity);\n" + "map.addOverlay(gpline);"; //var footer = "</coordinates></LineString></Placemark>\n</Document>\n</kml>"; // print coords header document.getElementById("coords").value = header; // loop to print coords for (var i = 0; i<(polyPoints.length); i++) { var lat = polyPoints[i].lat(); var longi = polyPoints[i].lng(); //This bit puts the commer in the between the coords if(i) {var commers = ", ";} else { var commers = "";} document.getElementById("coords").value += commers + "new GLatLng(" + lat + ", " + longi + ")"; } } else { header = "<" + "?xml version=\'1.0\' encoding=\'utf-8\'" + "?>\n" + "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Strict//EN\"\n" + " " + "\"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\">\n" + "<html xmlns=\"http://www.w3.org/1999/xhtml\" xmlns:v=\"urn:schemas-microsoft-com:vml\">\n" + "<head>\n\n" + "<meta http-equiv=\"content-type\" content=\"text/html;charset=utf-8\" />\n" + "<meta http-equiv=\"Content-Style-Type\" content=\"text/css\" />\n" + "<meta name=\"author\" content=\"Mario\" />\n" + "<meta name=\"generator\" content=\"Route\" />\n\n" + "<title>Digitized map</title>\n" + "<meta name=\"keywords\" content=\"Put your keywords in here\" />\n" + "<meta name=\"description\" content=\"Put your page description in here\" />\n\n" + "\n" + "<scr" + "ipt type=\"text/javasc" + "ript\">\n" + "//See if the browser is compatible\n" + "if (GBrowserIsCompatible()) {\n" + "//See if the object exists\n" + "if (document.getElementById(\"map\"))\n" + "{\n" + "//Create the map\n" + "var map = new GMap2(document.getElementById(\"map\"));\n" + "map.addControl(new GSmallMapControl());\n" + "map.addControl(new GMapTypeControl());\n" + "map.addMapType(G_PHYSICAL_MAP);\n" + "//Set the map centre and zoom level\n" + "map.setCenter(new GLatLng(43.23920036180898, 13.75213623046875), 9);\n" + "}\n" + "}\n" + "</scr" + "ipt>\n" + "</body>\n" + "</html>"; // print coords header document.getElementById("coords").value = header; // loop to print coords for (var i = 0; i<(polyPoints.length); i++) { var lat = polyPoints[i].lat(); var longi = polyPoints[i].lng(); //This bit puts the commer in the between the coords if(i) {var commers = ", ";} else { var commers = "";} document.getElementById("coords").value += commers + "new GLatLng(" + lat + ", " + longi + ")"; } } document.getElementById("coords").value += footer; } function showAddress(address) { if (geocoder) { geocoder.getLatLng(address, function(point) { if (!point) { alert(address + " not found"); } else { clearMap(); map.setCenter(point, 13); } } ); } } //]]> </script> </body> </html>
Rispondi quotando