Google Maps API Tutorial© 2006, 2007, 2008, 2009 Mike Williams |
| Translate this page: |
The AJAX PhilosophyNote: It's possible to use the basic philosophy behind AJAX without necessarily using ajaxslt.js or any of the specific technologies that happen to be mentioned in the AJAX acronym (Asynchronous Javascript And XML).The fundamental philosophy of AJAX is to load the static parts of your webpage only once, and request a small amount of information about the bits that change from a server. This makes changing the displayed data much faster. My new website does have PHP, so this example now uses it. Clicking the [A], [B] and [C] buttons causes the current markers to be cleared and a fresh set of information to be loaded from the corresponding XML file. Here's what the source of the PHP server script looks like PHP script, and here's the server script actually running: map11.php?q=a, map11.php?q=b, map11.php?q=c. In a real application you could use a server side script to respond to a query based on user input or map position. The Javascript would construct a query string to be sent to the server containing all the relevant information and pass a URL something like 'myserver.php?lat=-123.5&lng=44.2&zoom=11&selection=houses,schools,hotels'. The server would search the database for location information that matches the query and output XML code rather than HTML. Here's a really simple PHP script that reads this data file, finds the marker that's "nearest" to the ?lat= &lng= parameters that are passed in the URL, and outputs the data as XML. [Somebody with more experience in PHP could probably write it a lot better than that]. Here's that script in action map11a.php?lat=43.85&lng=-79.1 Non-AJAX PhilosophyThere's a temptation to write server side PHP or ASP script to generate the whole HTML page from scratch every time the data changes, generating a whole new set of HTML with the location specific information coded into Javascript commands. It works, but it means that a lot more data has to be sent from the server to the client, and the whole of the API code has to be reloaded, and, depending on the browser settings, it may mean that some or all of the map tiles, marker images and web page images get reloaded.You can see the difference by reloading the example page, instead of clicking on the [A] icon. |