Virtual Earth et Google Maps proposent une utilisation à travers un contrôle HTML auquel s'ajoute des plugins pour gérer le mode 3d. Ces derniers ne cessent d'évoluer mais pour le moment ils restent relativement simples.

virtual earth_header

La prochaine version de Virtual Earth présentée par Chris Pendleton lors du Mix08 intégrera un MapControl totalement en Silverlight avec des possibilités d'intégration de média au sein d'une expérience cartographique innovante.

En attendant, je vous propose d'intégrer les images de ces services cartographiques directement dans Silverlight 2.0 en utilisant la technologie DeepZoom pour améliorer la navigation sur la carte.

La démo est en dessous soit en "live" soit en vidéo.

Tout d'abord, je tiens à préciser que cette présentation est issue de l'excellent d'article de mon collègue CodePlexien, à savoir John O'Brien de Soulsolutions.
Il a pu dès l'apparition de la Beta 2 de Silverlight 2.0, se pencher sur les possibilités d'extension de la classe MulitScaleImage récemment annoncées par Scott Guthrie, ceci dès la sortie.

 

Explication détaillée de la solution de visualisation :

Lors de sa première tentative que j'avais étudié toute une soirée/nuit et adapté (voir suite), la solution utilisait un de nos propres serveurs pour servir de proxy de téléchargement des tiles de Virtual Earth.

Cette solution présentait un réel inconvénient puisque le serveur utilisé téléchargeait véritablement l'image et la renvoyait au client d'où un problème de lenteur et surtout de charge importante (bande passante surtout).

La redirection des tiles s'effectuait en quelque sorte "côté serveur".

Voici ce qui se passait dans cette solution :

 proxy_server

On remarquera que techniquement ce n'est pas une solution optimale et envisageable dans un scénario de forte utilisation.

 

Comme indiqué plus tôt, on peut avec Silverlight 2.0 Beta 2 étendre les possibilités de la classe MultiScaleImage afin de définir où les tiles doivent être téléchargées et ceci du côté client.

Voici un schéma des différentes communications réalisées par la solution de John et expliquée sur son site :

 john_solution

Cette solution est donc le meilleur compromis que l'on puisse trouver pour communiquer avec les serveurs de Virtual Earth pour récupérer les données cartographiques. A termes c'est même cette solution qui sera utilisée sur le MapControl Silverlight officiel.

 

Adaption générique :

Afin d'enrichir cette solution, j'ai tout d'abord choisi de refactoriser le code et ensuite tout en conservant l'idée de pouvoir connecter d'autres systèmes cartographiques.

Ceci est démontré ici en incluant le service Google Maps au sein de DeepZoom.

Voici alors ce qui se passe maintenant au niveau des communications :

 nico_solution

On remarque donc que les possibilités d'extensions de cette classe sont un véritable atout que l'on peut exploiter simplement.

Pour réaliser cela, j'ai modifié la technique de redirection utilisée par John afin de créer plusieurs méthodes générant les différentes url des tiles à utiliser. Cela me permet ainsi de connecter différentes sources de données très simplement.

 

Allons plus loin :

Nous allons réaliser un semblant de MapControl Silverlight pour ces services cartographiques puisqu'il est désormais possible de changer dynamiquement la source de données.

Ainsi ici nous allons proposer un contrôle Silverlight utilisant un élément MultiScaleImage bindé sur différentes sources de données que l'on choisira via programmation. 

Voici en attendant ce que je propose :

 

 Allez-y molo avec Google Maps sinon vous serez rapidement blacklisté pour une période plus ou moins longue. J'espère aussi que la démo sera toujours "live".

Démonstration :

Vous pouvez tout à fait le tester dès à présent à travers ce lien ou dans l'aperçu ci dessus.

Indications :

Si vous observez une erreur sur l'iframe (impossible d'accéder à la page) et sur la page, bien ça veut tout simplement dire que la page n'est plus accessible puisque j'héberge cela sur mon serveur et je n'ai pas forcément une ligne en conséquence.

Il se peut également que le serveur qui héberge les images de basses résolutions tombe (c'est arrivé il y a quelques jours, c'est un truc mutualisé...), je ne pense pas que cela puisse à nouveau arriver, mais cela résulte en général par un mauvais fonctionnement du contrôle voir un crash du plugin.

 

Voici un aperçu vidéo en cas de problème.

Bon sur la vidéo ça saccade un peu, si vous pouvez tester le contrôle vous même, vous verrez que ce n'est pas le cas, c'est "ultra fluide".

 

Limites techniques de la solution :

Comme indiqué, pour le moment nous ne nous disposons pas des fonctionnalités de ces services cartographiques. Il est en effet impossible d'y ajouter des punaises, des polylignes, des polygones.

Bref pour le moment il s'agit surtout d'un Proof of Concept qui exploite les possibilités de Silverlight 2.0 Beta 2 et qui prouve que l'on peut utiliser les services existants tout du moins leurs données.

codeplex_header

L'objectif à termes avec John et bien d'autres personnes motivées, c'est de pouvoir réaliser un MapControl-like en Silverlight 2.0 pour y ajouter des fonctionnalités existant sur le véritable contrôle. Nous irons bien plus loin que les fonctionnalités de base. 
John va très prochainement rendre disponible le projet CodePlex auquel je participerai pour apprendre et découvrir toujours plus.

Je défenderai également des idées que je souhaite intégrer/retrouver dans un tel contrôle notamment en termes d'internationalisation.

Si vous êtes intéressé, contactez-moi via les commentaires ou par contact.
Je communiquerai sur le projet dès qu'il sera accessible par tous et que l'on aura une première version disponible.

 

Limite d'utilisation :

Une autre limite importante concerne l'aspect "légal" de l'utilisation. En effet, si Microsoft tolère et prévoit même une solution pour utiliser les tiles depuis d'autres éléments que le MapControl de base (2d et 3d), Google lui ne prévoit pas cette alternative.

Il est d'ailleurs très important d'y aller molo avec le MapControl ici présenté puisque le téléchargement de tiles se fait de manière inhabituel et est détecté comme une tentative de téléchargement illicite par les serveurs de Google, d'où possible blacklisting (il faut alors entrer le texte d'un captcha...).

D'autant plus que les requêtes HTTP effectuées ne ressemblent pas du tout à des requêtes d'un navigateur (à ce propos si quelqu'un à une piste pour modifier le header du GET des tiles).

C'est alors que je me suis dis "pas grave je vais exploiter les tiles comme ils le font dans leur tout nouveau plugin 3d"... Et là je découvre que les échanges se font directement en brut. Pas de téléchargement de tiles de manière simple à en croire ce que j'ai rapidement étudié. J'y reviendrai d'ici quelques semaines.

 

Projet d'exemple :

Vous pourrez très prochainement télécharger le projet utilisé pour la démonstration ainsi que le projet CodePlex que nous allons réaliser.

N'hésitez pas à communiquer vos impressions sur le contrôle ou à remonter des bugs.
Oh, bien entendu le design de l'UI sera améliorée :), je ne suis pas designer, tout du moins je ne voulais pas en réaliser une très compliquée ici.

sl2_header

Conclusion :

Les possibilités de Silverlight 2.0, mais ce n'est pas une surprise, sont vraiment impressionnantes. L'accent mis sur le fait que ce soit simple à aborder pour un développeur .Net n'est clairement pas une utopie.
Je serai incapable de faire cela en Flash, je le réalise et l'optimise en .Net en langage C#, bref une véritable capitalisation de mes compétences.

Les possibilités étendues de DeepZoom permettent ce genre de réalisation, mais il est tout à fait possible de pousser la chose encore plus loin, je manquerai pas d'appronfondir le sujet avec de la génération dynamique de tiles au sein du contrôle Silverlight et même un miniprojet autour de ça.

Je vais avant la fin de la semaine tenter de créer un truc sympathique avec d'autres collections d'images, bref on verra en fonction du temps disponible.

Ce sera très prochainement, pour le moment je file étudier d'autres technologies et corriger mes erreurs/oublis.

UPDATE :

La projet CodePlex vient d'être mis en ligne :
http://www.codeplex.com/deepearth/

Nous sommes 7 personnes du monde entier à travailler sur le projet :
Shaun Becker, Jonas Follesø, Bronwen Zande, Darko Radiceski, Rob Farley, John O’Brien et moi-même.