Yahoo! Maps
Scritto da Gabriele Rocca il 11 Ago 2006 | Categoria: API How to
Come vedete sono ancora qua, probabilmente alcuni di voi diranno “ma quando vai in vacanza”?
La risposta è mai!!!
Visto che ero qui, ho pensato (forse per “par condicio”) di implementare oltre alle API di Google anche quelle di Yahoo!, iniziando da un classico: le mappe.
La prima differenza che si può notare tra i due tipi di mappe è che quelle di Yahoo!, sono disponibili in diverse “versioni”:
- Ajax
- Flash (usando Javascript o ActionScript)
- Flex
Le tre “versioni”, offrono pressappoco le stesse funzioni, ma solo quelle in Ajax non necessitano di installare nulla. Per questo motivo ho deciso di riportare un esempio solo di questo tipo.
Per prima cosa è necessario ottenere un application ID andando ad autenticarsi all’indirizzo http://api.search.yahoo.com/webservices/ register_application con un account Yahoo! (che potrete ottenere gratuitamente sul sito di Yahoo!) e successivamente scegliere l’application ID che preferite, purché risulti disponibile.
Come per Google, anche in questo caso sono necessarie pochissime righe di codice per aggiungere Yahoo Maps al vostro sito:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Aggiungere Yahoo! Maps ad una pagina web</title>
<!-- Sostituendo "INSERISCI_L'APPLICATION_ID" con il vostro application ID, lo sript importerà nella pagina tutto il codice Javascript necessario per gestire le mappe //-->
<script type="text/javascript" src="http://api.maps.yahoo.com/ajaxymap?v=3.0&appid= INSERISCI_L'APPLICATION_ID "></script>
<!-- Definisce la struttura della pagina dove verrà messa la mappa di dimensioni 600x450 px //-->
<style type="text/css">
#strutturaMaps {
width: 600px;
height: 450px;
top: 20px;
left: 300px;}
</style>
</head>
<body>
<div id="strutturaMaps"></div>
<script type="text/javascript">
// Crea un'oggetto alle coordinate di latitudine 45.068150 e longitudine 7.688050 (Torino)
var centro = new YGeoPoint(45.068150,7.688050);
// Definisce l'oggetto map che caricherà una mappa nell'elemento della pagina definito come "strutturaMaps"
var map = new YMap(document.getElementById('strutturaMaps'));
// Aggiunge una barra di controllo che permette tre tipi di
// visualizzazione: mappa, setellite e ibrida
map.addTypeControl();
// Aggiunge una barra di controllo per lo zoom
map.addZoomLong();
// Imposta il tipo di mappa come ibrida
map.setMapType(YAHOO_MAP_HYB);
// Mostra la mappa centrata alla latitudine e longitudine del punto "centro" con uno zoom di 1
map.drawZoomAndCenter(centro, 1);
</script>
</body>
Inserendo al posto di “INSERISCI_L’APPLICATION_ID” il vostro ID, potrete ottenere una mappa come questa.
Popularity: 16% [?]
Articoli collegati
