Je recherchais une solution solide qui me permettrait de créer une carte Web et de superposer des polygones vectoriels sans prendre un temps fou pour charger de telles données dans le but de permettre à chaque polygone d'afficher une couleur différente lors d'un survol.
Autant que je sache, il existe 3 options spécifiques pour y parvenir, que ce soit canvas, SVG ou Flash.
Flash semble être la meilleure solution si cela fonctionnait sur Apple iphones / ipads, car il semble offrir le rendu le plus rapide et l’affichage le plus propre. Canvas semble être le deuxième meilleur choix mais prend TRÈS longtemps si vous avez des centaines de polygones affichés sur une carte alors que SVG prend encore plus de temps à afficher.
J'ai presque perdu tout espoir de trouver une solution à ce problème, mais aujourd'hui je suis tombé sur une société appelée GISCloud http://www.giscloud.com (actuellement en version bêta avec inscription gratuite).
Cette société a réussi à trouver un moyen étonnant de rendre des centaines de vecteurs sur une carte en temps quasi réel. J'ai été surpris par leur approche et ma question à la communauté concerne la manière de reproduire leur approche pour une utilisation avec les technologies existantes telles que dépliants, openlayers, wax ...
Jetez un coup d'oeil par vous-même en visionnant cette incroyable démo: http://www.giscloud.com/map/284/africa
Assurez-vous de survoler les polygones de la page et testez les commandes de zoom pour vous assurer que ces polygones sont bien des vecteurs.
Ce que j’ai remarqué en examinant les requêtes avec Firebug, c’est que la carte demande des fichiers JSON spécifiques. Il semble que, selon le niveau / la zone de zoom, plusieurs fichiers json soient demandés.
Je devrais également mentionner ici qu'une fois que giscloud charge les données de la page survolant un vecteur, la couleur change immédiatement sans créer de nouvelle demande.
EXEMPLES:
- http://cft1.giscloud.com/t/1316509973/map284/layer1156/3/3/3.json
- http://cft1.giscloud.com/t/1316509973/map284/layer1156/3/5/3.json
- http://cft1.giscloud.com/t/1316509973/map284/layer1156/3/4/4.json
- http://cft1.giscloud.com/t/1316509973/map284/layer1156/3/3/4.json
- http://cft1.giscloud.com/t/1316509973/map284/layer1156/3/5/4.json
Je suppose que la structure de l'URL suit la logique du service de mosaïque standard (par exemple, le troisième au dernier dossier est le niveau de zoom ...).
Dans tous les cas, j’ai analysé les données réelles de ces fichiers json et il semble que la logique qu’ils utilisent suive un type de logique selon lequel ils créent leurs vecteurs à partir de ces valeurs de données:
- width / height: ils définissent la largeur et la hauteur des données servies dans chaque requête json
- pixels: ici, ils définissent des valeurs de pixels qui, je suppose, sont en quelque sorte liées à des coordonnées générales de pixels x / y pour des niveaux de points généralisés? Je suppose qu'ils ont en quelque sorte un moyen de simplifier automatiquement la région en fonction du niveau de zoom. Je suppose qu'en utilisant des coordonnées en pixels, je suppose qu'ils réduisent considérablement la taille des données à charger par rapport aux données lat / long.
- styles: ils définissent ici deux valeurs css RVB. "F" représentant la couleur du fichier de polygone et "S" représentant la couleur de la bordure du polygone.
- geom: voici où je suppose qu'ils définissent en quelque sorte de manière spécifique la définition de chaque polygone dans la tuile en cours de chargement, là où de telles données sont définies à partir de la fenêtre du conteneur de carte. Ce qui est également intéressant, c’est que chaque entrée a une valeur "S" qui, je suppose, est utilisée comme attribut optionnel ou valeur de lien de caractéristique. À la fin de chaque entrée, il existe une zone qui semble définir un identifiant par vecteur spécifique avec L'ID de couche que je devine est utilisé pour joindre d'une manière ou d'une autre les données de chaque demande de mosaïque json appelée.
Je suppose également qu'ils ont en quelque sorte trouvé un moyen de déterminer et de scinder automatiquement les données à charger pour chaque mosaïque en fonction de la taille des données devant être chargées pour la mosaïque demandée.
Voici une ventilation extraite de l'une de ces demandes:
{"width":256,"height":256,"tile":
{"pixels":
[0,6461,-1,0,5,148,0,509,-1,10715,-1,1,-1,251,-1,1,-1,1,-1,251,-2,3,-1,255,-1,249,-2,5,-2,247,-1,509,-3,251,-1,2,-2,253,-2,252,-2,254,-1,255,-1,254,-1,255,-1,1276,-2,13,-1,233,-1,2,-1,253,-1,1,-1,255,-1,247,-1,1306,-1,1533,-1,1269,-1,1276,-1,2303,-1]},
"styles":
[{"f":"rgb(99,230,101)","s":"rgb(5,148,0)","lw":"0"}],
"geom":
[
{"s":0,"p":[4,143,5,144,3,146,1,146,2,143,4,143],"c":"layer1156_5098"},
{"s":0,"p":[-2,143,0,140,2,141,2,144,1,146,-2,144,-2,143],"c":"layer1156_5067"},
{"s":0,"p":[7,143,5,144,4,143,2,143,2,141,5,138,6,139,5,141,7,143],"c":"layer1156_5051"},
{"s":0,"p":[10,141,11,137,12,137,14,137,12,142,9,143,9,142,10,141],"c":"layer1156_5041"},
{"s":0,"p":[1,136,0,140,-2,143,-2,136,1,136],"c":"layer1156_5038"},
{"s":0,"p":[8,143,5,141,5,137,8,136,10,137,10,141,8,143],"c":"layer1156_5033"},
{"s":0,"p":[5,137,2,141,0,140,1,136,1,136,2,135,3,136,5,137],"c":"layer1156_5028"},
{"s":0,"p":[10,134,12,136,11,138,8,135,10,134],"c":"layer1156_5020"},
{"s":0,"p":[-2,133,0,136,-2,136,-2,133],"c":"layer1156_5005"},
{...}
...
]
}
Comment pouvons-nous reproduire le même type de vitesse (ou un type similaire) en utilisant des postgis (que je semble utiliser aussi)?