Dans un billet précédent de ce blog, nous avions vu qu'il était possible de construire des flux rss (dapper) et de géolocaliser leur contenu (yahoo!pipe). Nous avions pris comme exemple les variations des indices principaux des bourses asiatiques.
La présentation par défaut sur la page du pipe a le bon goût d'exister mais convenons que le rendu n'est pas percutant. Il faut en effet cliquer sur chaque marqueur pour avoir les informations.
L'idéal serait d'avoir des marqueurs représentatifs de la variation de l'indice, vert quand positif, rouge quand négatif, avec une taille proportionnelle à cette variation.
Pour arriver à ce résultat, il faut un peu programmer. Un API maps est fourni par Google et Yahoo! donc nous allons travailler avec les 2 pour comparer.
Le principe est relativement simple, dans chaque carte (YMap et GMap), pour chaque pays présent dans le flux RSS, on ajoute un marqueur (YMarker, GMarker) personnalisé (YImage ou GIcon). La hauteur du marqueur est ajustée par la formule Math.round(Math.abs(fChange) * 20) et donc d'avoir une hauteur de 20px pour une variation d'indice de 1%. Le fichier source est disponible en annexe (fonction fFillYahooMapWithGeo et fFillGoogleMapWithGeo).
Les résultats sont visibles ci-dessous, avec à gauche Google en haut et Yahoo en bas.

google.map.asian.stock.daily.change2.jpg yahoo.map.asian.stock.daily.change2.jpg

Sur le plan fonctionnel, un léger avantage à Yahoo! qui permet d'afficher un label par un simple passage de la souris sur le marqueur alors que Google nécessite de cliquer dessus.
Les métriques ne font pas apparaitre de différences significatives entre les 2 API:

  • Temps de chargement: environ 4s,
  • Nombre de requêtes: légèrement plus pour Yahoo (71 contre 54),
  • Octets téléchargés: environ 400kO,
  • Nombre de lignes de code propres aux API: une dizaine.

Les 2 API offrant un services de géolocalisation, nous pouvons donc essayer d'utiliser directement le flux RSS de Dapper (non géo-localisé) et confier la tâche de géolocalisation aux API. Yahoo le permet très simplement en remplacant un paramètre d'entrée du constructeur de YMarker mais les requêtes sont synchrones (fonction fFillYahooMapWithoutGeo dans le source). L'API Google est plus délicate à mettre en oeuvre car il faut utiliser un objet GClientGeocoder et utiliser une fonction de callback.
Dans les tests, il a été constaté un léger ralentissement (environ 1s) avec cette méthode à cause d'une plus forte utilisation du réseau (17 requêtes de plus).

Avis subjectif de l'auteur:

  • Aucune API ne se démarque de l'autre. Celle de Google est légèrement plus complexe mais compense par légèrement plus de fonctionnalités.
  • Notre application est bien exigeante en bande passante et temps d'UC puisqu'elle nécessite de mettre en forme le HTML chez Bloomberg, de transférer ce flux de Bloomberg à Dapper qui est alors retraité en RSS, de transférer de Dapper à Yahoo pour géolocaliser, puis enfin de Yahoo au client. Si Bloomberg (ou un autre) fournissait directement le flux rss (idéalement déja géolocalisé et gratuitement), on ne serait pas obligé de faire tout cela :)


PS: La démo utilise l'objet XMLhttpRequest qui n'autorise pas chez Firefox les requêtes hors du domaine courant, alors que si chez IE. Donc

  • si vous utilisez IE, mettez simplement "urlProxy":"" à la ligne 29 dans maps.htm,
  • si vous utilisez Firefox, installez un serveur local (localhost) avec la page php_proxy_simple.php fournie en annexe,