Created
October 16, 2013 15:53
-
-
Save anonymous/7010144 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html xmlns="http://www.w3.org/1999/xhtml"> | |
| <head> | |
| <meta http-equiv="content-type" content="text/html; charset=utf-8"/> | |
| <title>Google Maps AJAX + mySQL/PHP Example</title> | |
| <script src="http://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script> | |
| <script src="http://maps.google.com/maps/api/js?sensor=false" | |
| type="text/javascript"></script> | |
| <script type="text/javascript"> | |
| //<![CDATA[ | |
| var customIcons = { | |
| restaurant: { | |
| icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png', | |
| shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png' | |
| }, | |
| bar: { | |
| icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png', | |
| shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png' | |
| } | |
| }; | |
| function load() { | |
| var map = new google.maps.Map(document.getElementById("map"), { | |
| center: new google.maps.LatLng(47.6145, -122.3418), | |
| zoom: 13, | |
| mapTypeId: 'roadmap' | |
| }); | |
| var infoWindow = new google.maps.InfoWindow; | |
| $.get("phpsqlajax_genxml2.php"); | |
| // Change this depending on the name of your PHP file | |
| downloadUrl("xmldata.xml", function(data) { | |
| var xml = data.responseXML; | |
| var markers = xml.documentElement.getElementsByTagName("marker"); | |
| for (var i = 0; i < markers.length; i++) { | |
| var name = markers[i].getAttribute("name"); | |
| var address = markers[i].getAttribute("address"); | |
| var type = markers[i].getAttribute("type"); | |
| var point = new google.maps.LatLng( | |
| parseFloat(markers[i].getAttribute("lat")), | |
| parseFloat(markers[i].getAttribute("lng"))); | |
| var html = "<b>" + name + "</b> <br/>" + address; | |
| var icon = customIcons[type] || {}; | |
| var marker = new google.maps.Marker({ | |
| map: map, | |
| position: point, | |
| icon: icon.icon, | |
| shadow: icon.shadow | |
| }); | |
| bindInfoWindow(marker, map, infoWindow, html); | |
| } | |
| }); | |
| } | |
| function bindInfoWindow(marker, map, infoWindow, html) { | |
| google.maps.event.addListener(marker, 'click', function() { | |
| infoWindow.setContent(html); | |
| infoWindow.open(map, marker); | |
| }); | |
| } | |
| function downloadUrl(url, callback) { | |
| var request = window.ActiveXObject ? | |
| new ActiveXObject('Microsoft.XMLHTTP') : | |
| new XMLHttpRequest; | |
| request.onreadystatechange = function() { | |
| if (request.readyState == 4) { | |
| request.onreadystatechange = doNothing; | |
| callback(request, request.status); | |
| } | |
| }; | |
| request.open('GET', url, true); | |
| request.send(null); | |
| } | |
| function doNothing() {} | |
| //]]> | |
| </script> | |
| </head> | |
| <body onload="load()"> | |
| <div id="map" style="width: 500px; height: 300px"></div> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <? | |
| $username="$username"; | |
| $password="$password"; | |
| $database=" $database"; | |
| ?> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?php | |
| //require("phpsqlajax_dbinfo.php"); | |
| function parseToXML($htmlStr) { | |
| $xmlStr = str_replace('<', '<', $htmlStr); | |
| $xmlStr = str_replace('>', '>', $xmlStr); | |
| $xmlStr = str_replace('"', '"', $xmlStr); | |
| $xmlStr = str_replace("'", ''', $xmlStr); | |
| $xmlStr = str_replace("&", '&', $xmlStr); | |
| return $xmlStr; | |
| } | |
| $data= '<markers> '; | |
| while ($row = @mysql_fetch_assoc($result)){ | |
| $data1 = '<marker ' . 'name="' . parseToXML($row['name']) . '" ' . | |
| 'address="' . parseToXML($row['address']) . '" ' . 'lat="' . $row['lat'] . '" ' . | |
| 'lng="' . $row['lng'] . '" ' . 'type="' . $row['type'] . '" ' . '/>'; | |
| } | |
| $data2 = '</markers>'; | |
| $xmlData = $data. $data1 . $data2; | |
| file_put_contents("xmldata.xml", $xmlData); | |
| ?> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <markers><marker name="Pan Africa Market" address="1521 1st Ave, Seattle, WA" lat="47.608940" lng="-122.340141" type="restaurant" /><marker name="Buddha Thai & Bar" address="2222 2nd Ave, Seattle, WA" lat="47.613590" lng="-122.344391" type="bar" /><marker name="The Melting Pot" address="14 Mercer St, Seattle, WA" lat="47.624561" lng="-122.356445" type="restaurant" /><marker name="Ipanema Grill" address="1225 1st Ave, Seattle, WA" lat="47.606365" lng="-122.337654" type="restaurant" /><marker name="Sake House" address="2230 1st Ave, Seattle, WA" lat="47.612823" lng="-122.345673" type="bar" /><marker name="Crab Pot" address="1301 Alaskan Way, Seattle, WA" lat="47.605961" lng="-122.340363" type="restaurant" /><marker name="Mama&#39;s Mexican Kitchen" address="2234 2nd Ave, Seattle, WA" lat="47.613976" lng="-122.345467" type="bar" /><marker name="Wingdome" address="1416 E Olive Way, Seattle, WA" lat="47.617214" lng="-122.326584" type="bar" /><marker name="Piroshky Piroshky" address="1908 Pike pl, Seattle, WA" lat="47.610126" lng="-122.342834" type="restaurant" /></markers> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment