Una possibilità davvero interessante è quella di poter visualizzare su una Google Map dei
markers le cui coordinate ed altri elementi siano caricati da un database esterno.
Questo ci consente di poter utilizzare insiemi molto grandi di coordinate lasciando sempre inalterato il codice javascript di richiamo della mappa.
In questo articolo non concluderemo il nostro lavoro, ci limiteremo a capire come costruire il nostro database, popolarlo e creare scripts Php per l'interrogazione dei dati e la realizzazione di un output XML. Ci ritroveremo dunque nella stessa situazione del precedente post: un file XML da dare "in pasto" al codice javascript affinchè i markers vengano visualizzati sulla mappa.
Questo post e il successivo fanno ampio riferimento al materiale, opportunamente semplificato e integrato nella parte divulgativa, contenuto nel bellissimo articolo (in inglese) che trovate su
Google Code.
Definiamo il progetto da realizzare: una sorta di "curriculum geografico", cioè una Google Map dove vengono visualizzati tutti i luoghi dove ho studiato o lavorato, le cui informazioni sono contenute in un database.
Essendo un progetto didattico, i dati in realtà sono molto pochi. Le potenzialità invece sono infinite, poichè potremmo inserire nel database grandi quantità di dati realizzate da terze parti e, con le opportune conoscenze tecniche, filtrarli nella maniera che più ci interessa.
Di cosa abbiamo bisogno:
1) Uno spazio web con supporto
MySQL e
PHP2) Alcuni cenni su come si costruisce un
database relazionale3) Piccole conoscenze di
PHP e
JavascriptPUNTO 1
Ci sono due possibilità: la prima è quella di registrarsi su Internet ad un servizio di spazio web gratuito con le caratteristiche cui sopra. Vi ho già citato
ilbello.com hosting, ma i servizi di questo tipo sono innumerevoli. Una selezione ai altri servizi gratuiti e ad free potete trovarla in
questo post.
La seconda possibilità è lavorare in locale, cioè utilizzare il proprio PC come fosse un server web. A questo scopo potete utilizzare pacchetti software come
XAMPP o
EasyPHP. Per la corretta installazione potete far riferimento ai link in calce all'articolo.
PUNTO 2
Ci affideremo a un database relazionale, strutturato in tabelle (a noi ne serve solo una). Il nostro spazio web, sia esso reale o virtuale, ci consentirà di creare e popolare (inserire dati) un database attraverso il linguaggio di amministrazione
PhpMyAdmin.
Per quanto riguarda il servizio ilbello.com si accederà all'interfaccia PhpMyAdmin all'indirizzo
http://sql.ilbello.com/, inserendo
username e
password fornitici al momento della registrazione. Per gli altri servizi, cambierà ovviamente l'indirizzo di accesso ma le modalità saranno identiche.
Per creare e popolare la tabella del database si posono utilizzare diversi metodi:
1) Inserendo ciascun elemento attraverso l'interfaccia di PhpMyAdmin
2) Importando in PhpMyAdmin opportuni files sql come ad esempio questo:
CREATE TABLE `markers`(
`id` INT NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`denom` VARCHAR( 60 ) NOT NULL ,
`indirizzo` VARCHAR( 60 ) NOT NULL ,
`lat` FLOAT( 10, 6 ) NOT NULL ,
`long` FLOAT( 10, 6 ) NOT NULL,
`tipomarker` VARCHAR( 30 ) NOT NULL ,
) ENGINE = MYISAM ;
Cosa dico attraverso questo set di istruzioni?
crea una tabella con 6 campi: il campo id è un indice che si autoincremente; il secondo campo, denom, ha al massimo 60 caratteri; lo stesso dicasi per il campo indirizzo; lat e long sono campi numerici, al massimo di 10 cifre di cui 6 decimali; tipomarker ha al massimo 30 caratteri; MYISAM è il motore di indicizzazione del database.
3) Importando opportuni files in formato
CSV (ottenuti da terze parti o dal nostro
foglio elettronico).
PUNTO 3Attingiamo adesso ad alcuni elementi di PHP per accedere ai dati del database ed elaborarli in modo da formare un documento XML. Per motivi di sicurezza si sceglie di creare due script distinti, uno con le credenziali di autenticazione e l'altro che riceve le credenziali, accede al database e forma il documento XML. Ecco i listati dei due file, credenziali.php e
creaxml.php. Notate che cliccando su quest'ultimo link non viene visualizzato lo script bensì il suo risultato, cioè il file XML con i dati che visualizzeremo sulla mappa.
<?
//Ovviamente $username, $password e $database conterranno i valori comunicati dal
vostro fornitore del servizio di hosting o scelti a piacere se utilizzate un server
web in locale
$host="localhost";
$username="vostrousername";
$password="vostrapassword";
$database="vostrodatabase";
?>
<?php
// richiede i dati di accesso contenuti in credenziali.php
require("credenziali.php");
//Sostituisce alcuni caratteri speciali con il relativo codice entita'
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;
}
// Si connette al database
$connection=mysql_connect (localhost, $username, $password);
if (!$connection) {
die('Non connesso : ' . mysql_error());
}
$db_selected = mysql_select_db($database, $connection);
if (!$db_selected) {
die ('database non selezionato : ' . mysql_error());
}
// Seleziona tutte le righe della tabella con i markers
$query = "SELECT * FROM markers WHERE 1";
$result = mysql_query($query);
if (!$result) {
die('Query invalida: ' . mysql_error());
}
header("Content-type: text/xml");
// Genera il nodo principale del file XML
echo '<markers>';
// Ciclo che crea il resto del documento XML sulla base dei dati della tabella
while ($row = @mysql_fetch_assoc($result)){
// ADD TO XML DOCUMENT NODE
echo '<marker ';
echo 'denom="' . parseToXML($row['denom']) . '" ';
echo 'indirizzo="' . parseToXML($row['indirizzo']) . '" ';
echo 'lat="' . $row['lat'] . '" ';
echo 'long="' . $row['long'] . '" ';
echo 'tipomarker="' . $row['tipomarker'] . '" ';
echo '/>';
}
// Genera il tag di chiusura del nodo principale
echo '</markers>';
?>
Per adesso abbiamo finito, nel prossimo articolo vedremo come integrare il tutto all'interno nella Google Map, utilizzando istruzioni di cui ormai conosciamo il significato.
Linkografia per chi desidera installare un server in locale
Per installare XAMPP
@ Corso Joomla su Second Life (consultare le slide dalla 6 alla 22)@ Slideshare (consultare le slide dalla 6 alla 22)@ XAMPP step by step @ Installare XAMPP su WindowsPer installare Easy PHP
@ Guida PHP su Windows@ Installare e configurare Php e MySQL