AjaxAPI, Affichage des informations traffic depuis GeoRSS

Ce widget est propulsé par

Si vous suivez la présentation de l'API Yahoo!Maps dans l'ordre de ce site, vous avez pu prendre connaissance de l'exemple basique d'utilisation , du placement de marqueur sur des cartes Y!Maps , de l'ajout d'outils de contrôles des cartes Y!Maps, de la géolocalisation d'adresse avec Y!Maps , ainsi que de l'utilisation de fichiers XML GeoRss pour "peupler" et "dessiner" vos cartes Y!Maps.

Cette page vous présente l'utilisation de méthodes propres à Yahoo! qui vous permettent de récupérer des sources d'informations supplémentaires pour vos cartes (Yahoo! Local, Yahoo! Traffic).
Ces sources d'informations sont disponibles sous format XML.





#00 :: Affichage des informations Traffic (YMap.searchTraffic())

Affichage des informations Traffic (YMap.searchTraffic())

Ce premier exemple tire parti des services Yahoo!Traffic qui sont directement reliés au sein de la librairie Javascript pour permettre la méthode YMap.searchTraffic() qui récupère le fichier de données "Traffic" au format XML et qui sert pour le "peuplement" de la carte.

La carte est chargeable à l'aide du bouton "charger la carte" et exportable grâce au bouton "exporter la carte en XML".

  


Trois méthodes sont utilisées au sein de cet exemple afin de parvenir au résultat présenté sur la carte ci-dessus :

• YMap.searchTraffic (YGeoPoint,radiusSearch) : méthode de YMap permettant de lancer la recherche à partir d'un point précis avec possibilité de préciser un rayon personnalisé de recherche à partir du point précisé.
• trafficF : méthode définie au sein d'une variable qui permet une fois la recherche d'informations 'Traffic' terminée de traiter le retour au format XML et de créer les marqueurs et fenêtres d'informations correspondantes.
• setupMarker (YGeoPoint,String(titre)) : méthode spécialisée permettant de définir et créer la fenêtre d'informations traffic lors de la boucle de 'trafficF()'.

Le code source de cet exemple est recopié ci après :
<!-- élément container de la carte --> <div id="carteYahoo"></div> <!-- boutons d'actions HTML --> <input type="button" name="ok_0" id="ok_0" value="charger la carte" onClick="chargerCarteYahoo('carteYahoo');" />   <input type="button" name="ok_1" id="ok_1" value="exporter la carte en XML" onClick="exporterCarteYahoo('carteYahoo');" disabled="true" /> <!-- code Javascript d'action --> <script type="text/javascript" language="JavaScript"> var map = null; function chargerCarteYahoo(idEl) { map = new YMap(document.getElementById(idEl)); var cPT = new YGeoPoint(34.052222,-118.242778); map.addZoomLong(); map.addTypeControl(); map.disableKeyControls(); map.drawZoomAndCenter(cPT,5); var setupMarker = function(p,d) { var m = new YMarker(p); m.addAutoExpand(d); return m; }; // traitement de l'objet (e), xml , // résultats de la recherche traffic var trafficF = function(e) { var _p = []; if (e.Data) { for (var a in e.Data.ITEMS) { var l = e.Data.ITEMS[a]; if (l.TITLE) { var p = new YGeoPoint(l.LATITUDE,l.LONGITUDE); _p.push(p); var m = setupMarker(p,l.TITLE); map.addOverlay(m); } } } }; //args: point, radius map.searchTraffic(cPT,2); // listen for completion of traffic info search YEvent.Capture(map,EventsList.onEndTrafficSearch,trafficF); $('ok_0').disabled = 'true'; $('ok_1').disabled = false; } function exporterCarteYahoo () { // GeoRSS formtatted string var GeoRSSString = map.exportFormat('GEORSS'); if (GeoRSSString) { $('exportXML').value = GeoRSSString; $('exportXML').style.display = "inline"; } else return false; } </script>

: 02/03/2007 03:24:41 | : Yahoo.Maps, Yahoo, Ajax, API, ajax, api, YGeoRSS, RSS, GeoRSS, infoTraffic, Webjax.Traffic, GPS,

Aucun commentaire enregistré