My first PHP/MySQL/AJAX application

This post is intended to serve as a start point to others who have interest in developing their first GoogleMaps application using PHP/MySQL, to those who enjoy reading about this stuff just for fun and to those who don't have a clue about what these acronyms mean but perhaps would like to get into it after you've seen the result. The idea is to follow the design proposed here by Pamela Fox.

Requirements:

• Apache, PHP5, MySQL
• Basic knowledge about Javascript and XML
• Google Maps API key (you can get one here with a Google Account)

How To:

• Step 1. Populate your database with data. There are several ways to do this. I chose to manually introduce 4 sample rows with phpmyadmin. You can populate the database with the data that you like but don't forget to reserve two fields (type float) for the latitude and longitude:

database sample entries

• Step 2. Output XML. In this part is where your PHP code has to query the database, extract the data and generate an XML output that the XMLHttpRequest can access later on from your main page. It's important that you keep your username, password and database name on a different file (dbinfo.php):

dbinfo.php

In order to query the database we just need to open a connection and run our query (xmlGenerator.php part 1):

xmlGenerator.php (I)

Yet, the xml output has to be generated and that is done by making use of the dom functions (xmlGenerator.php part 2):

xmlGenerator.php (2)

• Step 3. Now, all that's left is to load the markers in a Google map. If you are new to the Google Maps API, take a look at "The Hello World of Google Maps". Once we have our Google Maps API key for our URL, all we need to do is to load the map and the markers. This is done by the GDownloadUrl function, which is the wrapper of the XMLHttpRequest. The design of the main HTML page is left for the reader. The only two javascript functions used in the creation of the map are as follow:

load function

createMarker function

Finally, the part from which the load function is called:

Before the display of the markers, remember to store all marker information in the database, In this case, for the display of a picture, html code was stored previously in a VARCHAR field in the database. The result of all looks like this:

Precautions and Tips:

• Make sure you are using PHP5 and not PHP4 and that you don't have the domxml library activated on the php.ini file, since this could cause some incompatibility problems while trying to output data in XML. PHP5 has a dom library already built in and you shouldn't have to worry about anything if you intend to generate the XML data the way it was explained here.
• If you want to deploy your application in your machine, just type http://localhost/ in the signup page for a Google Maps API key (stupid but it works).

Sources for this post:

Google Code FAQ - Using PHP/MySQL with Google Maps
Using PHP 5's DOM functions to create XML files from SQL data
Google Maps API

Día de descubrimientos

Hoy ha sido un día de esos en los que empiezas pensando cómo cocer las judías verdes y acabas rehogando una alcachofa. Todo ha empezado rebuscando en el API de Google Maps, para hacer un primer tanteo de lo necesario para hacer un mash-up con los datos de localización de los visitantes de una página web. La idea era reutilizar los datos de Google Analytics, que se pueden exportar en varios formatos, entre ellos XML y CSV, para ser reutilizados por otra aplicación, o bien en PDF, si lo que se persigue es únicamente la presentación en un informe de los mismos. Rebuscando, he encontrado una aplicación para Adobe Air (Adobe Integrated Runtime), llamada Google Analytics Reporting Suite, que ya se encarga de importar los datos de localización en google maps.

Como se cuenta en este acertado análisis en genbeta, Adobe Air es un sistema multiplataforma, para Windows, Mac y Linux, que va cobrando cada día más fuerza. Cada día va cobrando más importancia la idea de que las aplicaciones no deberían dejen de funcionar cuando se pierde la conexión a internet (Wi-fi, WiMax, etc.). Véase Google Gears. Carece también de sentido que se tengan que hacer dos versiones de una misma aplicación, una online y otra offline. Así que Adobe Air se va abriendo hueco con este propósito y permitiendo así a los desarrolladores, adaptar aplicaciones que usan las tecnologías web, AJAX, Flash, etc. pero en el escritorio. Algo así como los widgets, o los Google gadgets, pero bajo un mismo entorno.

Superada la fascinación, hemos seguido emperrados en encontrar una manera sencilla de hacer mash-up, ya no para esta ocasión, sino para venideras y he leído algo sobre KML y cómo hacer uso del mismo para mash-ups. Es el formato definido en el Google Maps API para exportar y utilizar datos de localización y formas geométricas. Esto último es lo que más me ha llamado la atención. El hecho de que en KML se puedan definir formas geométricas en un mapa, puede servir en un futuro para ampliar su uso a otro tipo de aplicaciones para entornos urbanos como simulaciones de propagación radio, atenuación de intensidad de sonido, que son objeto ahora mismo de desarrollo propietario en la mayoría de las empresas interesadas, por ejemplo en AWE communications, en Stuttgart.

Ya, acercándome al final de la jornada de descubrimientos de hoy, he acabado en la página de Google Code, donde he estado leyendo en qué consisten algunos de los proyectos. Algunos no pintan mal, y al interesarme más he terminado en el canal Youtube de Google Developers para acabar tostado por lo tremendamente aburridas que son las presentaciones y entrevistas que he visto. No he podido acabar ninguna. Ya lo siento pero es que no se puede ver tostones así. Y si no me creen, por favor comparan cualquiera de estas entrevistas o presentaciones con las que utiliza como ejemplo Franchu's Lair en uno de sus posts sobre cómo debe hacerse una presentación, el Identity 2.0. Merece la pena. Les dejo a continuación con la presentación sobre cómo se deben distinguir identidad, autorización y autenticación y cómo y quién debe administrar las identidades digitales.




Eso es todo amigos, que los disfruten y aprovechen.