Suite

OpenLayers n'affiche pas la couche GeoJSON avec des fonctionnalités ajoutées après coup

OpenLayers n'affiche pas la couche GeoJSON avec des fonctionnalités ajoutées après coup


J'ai une couche vectorielle avec une couche source GeoJSON. OpenLayers n'affiche pas la couche lorsque j'essaie d'ajouter des entités à l'aide duajouter des fonctionnalitésméthode:

myGeoJSONObject = { /* un GeoJSON */ }; editLayer = new ol.layer.Vector({ source : new ol.source.GeoJSON({ style : styleFunction, defaultProjection : 'EPSG:4326', projection : "EPSG:3857" }) }); editLayer.getSource().addFeatures(myGeoJSONObject); map.addLayer(editLayer);

La solution, j'ai trouvé, était d'ajouter le GeoJSON via la propriété "object" de l'objet source GeoJSON, comme ci-dessous :

editLayer = new ol.layer.Vector({ source : new ol.source.GeoJSON({ style : styleFunction, defaultProjection : 'EPSG:4326', projection : "EPSG:3857", object : myGeoJSONObject }) });

J'ai également constaté que je devais avoir les options de projection spécifiées, sinon j'aurais une erreur de ne pas trouver le CRS lors de la spécification de la propriété de l'objet.


Exemple OpenLayers 2 (symbolizers-fill-stroke-graphic.html) Démontrer les propriétés de remplissage, de trait et graphique des symboliseurs. OpenLayers.Map,O

Exemple d'une couche WMS à image unique. WMS peut être utilisé comme couche Image, comme illustré ici, ou comme couche Tile, comme illustré dans l'exemple d'exemple WMS en mosaïque. Les tuiles peuvent être mises en cache, de sorte que le navigateur ne récupère pas les données pour les zones qui ont déjà été consultées.

OpenLayers fournit plusieurs contrôles par défaut et la possibilité de créer vos propres contrôles personnalisés. Pour notre exemple, je vais simplement ajouter un simple contrôle en plein écran pour la carte afin que vous puissiez le changer


Historique des versions

- Correction d'un problème où les groupes de boutons segmentés ne se développaient pas toujours lorsqu'ils étaient sélectionnés dans certains cas.

Carte interactive

- Correction de l'opacité du polygone définie sur 1 si l'opacité personnalisée n'est pas fournie pour les sources de données vectorielles.

- Tropical : Correction de la catégorie de système extratropical (EX) n'étant pas rendue/stylée correctement.

- Routage : correction d'un problème où les fichiers source SCSS/CSS du module de routage n'étaient pas inclus dans le package NPM publié.

Sortie le 13 mai 2021

- Comprend le nouveau module de routage. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/map-modules/routing-module/ pour plus d'informations.

InteractiveMapApp

- Correction d'un problème où le contrôle de l'opacité du calque initial ne reflétait pas l'opacité initiale du calque dans certains cas.

Carte interactive

- Correction de plusieurs problèmes liés aux configurations de style d'opacité des calques avec des sources de données vectorielles/polygonales.

- Correction d'un problème où les événements de clic de polygone n'étaient pas déclenchés sur la carte.

- Ajout d'un nouveau module de routage pour la planification et la visualisation des informations sur les itinéraires et les actifs ainsi que des données météorologiques critiques. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/map-modules/routing-module/ pour plus d'informations.

Sortie le 12 avril 2021

- Mise à jour de la configuration de construction pour la bibliothèque précompilée afin d'utiliser des morceaux nommés afin d'éviter les conflits avec d'autres versions basées sur Webpack utilisant des modules en morceaux.

InteractiveMapApp

- Correction de plusieurs problèmes avec les déclencheurs d'événements de sélection et de désélection de contrôle de couche lorsqu'ils font partie de groupes de segments.

- Correction et amélioration de la disposition et du rendu du panneau, en particulier lorsqu'il est configuré comme bascule.

Carte interactive

- Mise à niveau de la version de Leaflet par défaut vers la 1.7.0.

- Ajout de la prise en charge des contrôles d'opacité pour les calques vectoriels (polygones).

- Correction des calques d'animation n'utilisant pas la chaîne de calque AMP appropriée comme calque parent.

- Correction de l'opacité n'étant pas définie correctement pour les superpositions de Google Maps pour les animations.

- Ajout d'une gestion améliorée des erreurs autour du chargement paresseux des ressources du module.

Sortie le 10 février 2021

InteractiveMapApp

- Correction de l'opacité des calques n'étant pas appliquée aux calques animés lors de l'utilisation du nouveau contrôle d'opacité des calques introduit dans la 1.4.0.

- Correction de problèmes de mise en page avec le panneau des calques lorsque seuls les contrôles liés au module sont ajoutés.

- Mise à jour pour utiliser le point de terminaison /conditions au lieu de /observations pour les données météorologiques actuelles dans le panneau d'informations météorologiques locales.

Carte interactive

- Mise à jour pour utiliser Mapbox GL 2.0.

- Correction des couches de polygones qui n'étaient pas toujours supprimées de la carte lors de l'utilisation de la stratégie Mapbox.

- Ajout d'une propriété 'warning' à ApiResult qui contiendra tous les avertissements envoyés par l'API à la place de l'objet d'erreur.

- Ajout de la prise en charge des gestionnaires d'événements `onMarkerClick` et `onShapeClick` sur une sous-classe de groupe de modules dans `ModuleGroup`.

Sortie le 11 janvier 2021

InteractiveMapApp

- Ajout de la prise en charge du nouveau contrôle des paramètres de calque, y compris un contrôle d'opacité intégré pour les calques raster et de tuiles. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/interactive-map-app/layers-panel/#button-controls pour plus d'informations.

- Ajout de la prise en charge de la mise à jour des configurations du panneau de carte au moment de l'exécution. Voir https://www.aerisweather.com/docs/js/classes/interactivemapapp.html#updatepanel.

- Calculs de disposition de panneau de carte améliorés et fixes pour différentes combinaisons de configuration de disposition.

- Amélioration de la sélection des boutons du panneau des calques en fonction des événements d'ajout/suppression de la source de la carte interactive sous-jacente.

- Correction des problèmes de sélection de boutons segmentés lors du basculement entre les options des boutons du panneau des calques.

- Correction de la visibilité de l'icône du panneau de légende lorsqu'aucune légende n'a été ajoutée.

- Correction des menaces qui ne s'affichaient pas dans le panneau d'informations météo locales.

- Correction des légendes qui n'étaient pas toujours supprimées lors de la désélection de leur calque associé en fonction de la chaîne de calque utilisée.

Carte interactive

- Correction d'un problème avec les instances VectorSource ne se mettant pas toujours à jour lorsque les limites de la carte changent.

Sortie le 16 novembre 2020

- Diverses corrections de bugs mineurs et améliorations de la stabilité.

InteractiveMapApp

- Ajout de l'accès public aux classes de panneaux individuels au
applications module. Cela vous permet d'utiliser ces panneaux en dehors d'une instance `InteractiveMapApp`, comme les utiliser avec l'instance `InteractiveMap`. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/interactive-map-app/#using-panels-with-interactivemap pour plus de détails.

- Correction d'un problème avec les contrôles de couche qui n'étaient pas sélectionnés correctement pour les boutons segmentés en fonction des valeurs de couche initiales fournies à l'instance d'application de carte.

- Correction du panneau des calques afin qu'il soit masqué si aucun élément de calque n'est configuré.

Carte interactive

- Ajout de la prise en charge de la récupération des heures de couche AMP valides pour les couches météorologiques raster. Vous pouvez également définir l'animation d'un calque spécifique pour utiliser ces heures valides comme intervalles plutôt que de laisser l'animation calculer automatiquement les intervalles. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/interactive-map/managing-layers/#using-amp-valid-times pour plus d'informations.

- Correction de quelques problèmes de lecture occasionnels lors de l'animation de calques antérieurs lorsque la chronologie commence à

Sortie le 3 septembre 2020

InteractiveMapApp

- Ajout de la prise en charge de la désactivation de la sélection multiple dans tous les groupes pour les boutons segmentés groupés. Voir la nouvelle option de configuration `groupMultiselect`.

- Correction de problèmes mineurs de mise en page avec le panneau d'informations de la carte pour les appareils mobiles.

- Sélecteurs CSS améliorés pour réduire les conflits de style potentiels lorsqu'ils sont utilisés dans un contexte Web tiers.

Carte interactive

- Ajout de la prise en charge de la spécification des valeurs de la chronologie de/vers en tant que décalages de chaîne relatifs (par exemple, '-2 heures', '-1 semaine', etc.). Consultez les options de configuration de la chronologie disponibles sur https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/interactive-map/timeline/#using-relative-time-offsets.

- Correction d'un problème où les marqueurs de qualité de l'air étaient rendus comme marqueurs de carte par défaut lorsque les données du modèle étaient nulles ou indisponibles.

- Correction d'un problème où l'option de remplacement de style « zIndex » n'était pas définie sur les couches de tuiles lors de l'instanciation.

- Ajout des rayons de vent de prévision à la source de données « Windfields ».

- Ajout de légendes pour les sources de données 'Breakpoints' et 'Windfields'.

- Mise à jour de la conception et de la mise en page de la vue du panneau d'informations des points de suivi tropicaux.

Sortie le 12 août 2020

InteractiveMapApp

- Amélioration et nettoyage du rendu des éléments View et Component de base dans une instance InteractiveMapApp.

Carte interactive

- Plusieurs améliorations de vitesse et de performances ont été apportées au chargement et aux animations des tuiles raster.

- Ajout de la prise en charge de la poursuite de l'animation après des changements de région de carte visibles (par exemple, panoramique et/ou zoom), qui est désormais la valeur par défaut. Désactivez cela en activant `resetOnBoundsChange` sur la configuration de la chronologie. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/interactive-map/configuration/

- Ajout de nouvelles options de configuration de l'animation de la chronologie pour améliorer l'expérience de chargement/lecture : `bufferIntervals`,`showLoadingIntervals`. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/interactive-map/timeline/#configuring-animation-data-loading-behavior pour une comparaison des différentes options de configuration disponibles.

- Correction d'un problème où le paramètre `timeline.intervals` dans la configuration de la carte ne remplaçait pas la valeur par défaut.

- Correction d'un problème où la définition de la propriété de durée de la chronologie pendant la lecture ne recalculait pas la synchronisation et la vitesse de l'animation.

- Correction d'un problème où une animation en pause démarrait la lecture après un événement de panoramique et/ou de zoom de la carte.

- Correction d'un problème où les calques non animables arrêtaient la lecture d'une animation lorsqu'ils étaient ajoutés/supprimés de la carte.

- - Plusieurs améliorations ont été apportées à l'affichage et au masquage des trames de données de tuiles spécifiques au temps pendant la lecture de l'animation.

- Correction et amélioration de la gestion de l'ordre des couches lors de l'utilisation de Google Maps.

- Correction d'un problème où le centre/zoom de la carte était modifié par défaut lors de l'instanciation d'InteractiveMap avec une instance de carte Mapbox existante.

- Correction d'un problème de rendu lorsque les pistes de prévision des cyclones croisaient la ligne de date, en particulier lors de l'utilisation de la stratégie Leaflet.

- Amélioration de la prise en charge du remplacement de la légende lors de l'utilisation de GroupedLegend (par exemple, « radar », « conditions routières », etc.). Vous pouvez maintenant remplacer le facteur de largeur pour chaque élément de légende du groupe.

Sortie le 5 mai 2020

- Correction d'erreurs lors de l'utilisation du SDK dans Internet Explorer 11.

InteractiveMapApp

- Ajout de la prise en charge du re-rendu des données VectorSource sans recharger les mêmes données (par exemple, filtre actif/type de données modifié). Voir l'option `reloadOnChange` pour SegmentedButton : https://www.aerisweather.com/docs/js/globals.html#segmentedbuttonoptions

Carte interactive

- Correction d'une erreur occasionnelle sur le panoramique de la carte pour les stratégies de cartographie Google et OpenLayers.

- Correction d'un problème où les commandes de zoom n'étaient pas supprimées pour la stratégie Leaflet lorsqu'elles étaient désactivées via la configuration de la carte Leaflet.

Module Tropical

- Correction d'un problème avec les pistes des cyclones tropicaux qui traversaient la ligne de date internationale d'ouest en est.

Sortie le 17 mars 2020

- Introduit une nouvelle fonctionnalité de modules de carte pour InteractiveMap et InteractiveMapApp. En savoir plus sur cette fonctionnalité sur https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/map-modules/.

- Ajout de la prise en charge du passage des options de configuration via les méthodes de commodité ApiRequest et MapRequest sur `AerisWeather.api()` et `AerisWeather.map()`.

- Plusieurs corrections de bugs mineurs et améliorations via la bibliothèque.

InteractiveMapApp

- Ajout du support pour les modules de carte. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/map-modules/interactive-map-app/.

- Ajout de nouveaux groupes de modules de carte intégrés et modules de carte associés : AviationGroup - FlightRules, SIGMETs, StationPlots TropicalGroup - Breakpoints, Invests, Systems, Windfields. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/map-modules/#built-in-modules.

- Ajout de la prise en charge des segments groupés dans SegmentedButton. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/interactive-map-app/layers-panel/#grouped-segments.

- Ajout d'un indicateur de chargement de données sur les contrôles de couche associés aux sources de données vectorielles.

- Ajout de la prise en charge de la définition des unités de mesure actuelles via `setMetric()`, auxquelles les calques et le contenu de la vue du panneau d'informations peuvent répondre lors d'un changement.

- Ajout de la prise en charge du basculement des unités dans la vue intégrée du panneau d'informations météo locales.

- Ajout de la prise en charge de la fourniture d'une fonction de rappel « onChange » sur les configurations de groupe de boutons pour répondre aux changements de valeur au sein du groupe. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/interactive-map-app/layers-panel/#button-groups

- Ajout de la prise en charge de la configuration du formatage de la chaîne d'heure/date pour le panneau de la chronologie. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/interactive-map-app/timeline-panel/#configuration

- Ajout de `closeInfoPanel` pour ignorer un panneau d'informations présenté.

- Ajout d'un indicateur de fermeture au survol pour les contrôles de couche qui peuvent être activés/désactivés. Cela ne s'applique pas aux boutons d'un groupe qui fonctionnent comme un filtre/une bascule.

- Correction d'un problème où les limites visibles de la carte n'étaient pas toujours utilisées lors du rechargement des données de source vectorielle.

- Correction d'un problème où le composant de recherche de lieu n'incluait pas les états pour les recherches de nom d'état complet.

- Correction de la gestion des événements tactiles mobiles pour le contrôle du sélecteur de plage de chronologie.

- Correction de plusieurs problèmes de calcul de mise en page avec le panneau de boutons des calques.

- Correction de plusieurs problèmes liés à la sélection des boutons du panneau des calques et à l'ID/la valeur d'un bouton.

Carte interactive

- Ajout du support pour les modules de carte. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/map-modules/interactive-map/.

- Ajout de nouveaux groupes de modules de carte intégrés et modules de carte associés : AviationGroup - FlightRules, SIGMETs, StationPlots TropicalGroup - Breakpoints, Invests, Systems, Windfields. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/map-modules/#built-in-modules.

- Ajout de la prise en charge de la définition des unités de mesure actuelles via `setMetric()`, auxquelles les calques et le contenu de la vue du panneau d'informations peuvent répondre lors d'un changement. Vous pouvez renvoyer la valeur de l'unité actuelle via `isMetric()`.

- Ajout du support pour ignorer la création/le rendu des marqueurs en retournant `< skip: true >` à partir de la configuration de style d'une source de données vectorielles. Voir https://www.aerisweather.com/support/docs/toolkits/aeris-js-sdk/interactive-map/styling/#styling-point-data

- Correction d'un problème avec GeoJsonSource où les modèles sans propriété 'id' valide entraînaient une erreur. Désormais, `id` sera généré automatiquement pour les modèles pour lesquels il manque la propriété requise.

- Correction d'un problème où la légende des avis affichait parfois tous les avis possibles lors du rendu initial avant de passer aux avis actifs dans les limites visibles de la carte.

- Ajout de la prise en charge des nouveaux paramètres `lod` et `mindist` disponibles dans l'API de données.


SVG pour la cartographie Web et SIG/GML en ligne

Standardisation appliquée pour la mise en œuvre de SVG WebGIS

Papertopic : SVG pour la cartographie Web et les SIG/GML en ligne

Auteur(s) : LI, Yan (Université normale de Chine du Sud) et Guobin Chi (Université normale de Chine du Sud)

Un SIG Web SVG est un hotspot d'étude ces dernières années, et de nombreuses personnes essaient de créer une solution XML-GML-SVG pour développer un SIG Web. Néanmoins, la plupart des études et tentatives ont montré que les principales fonctions implémentées côté serveur avec le traitement GML et SVG n'étaient utilisées que pour visualiser les résultats du GML traité. Cette solution est très facile à provoquer le problème de congestion car chaque demande d'opération du côté client sera envoyée au côté serveur pour exécution et réponse. De toute évidence, lorsque de nombreuses demandes d'utilisateurs simultanées se produisent, l'efficacité du système doit être fortement ralentie. Et puis, en raison des limitations de GML, certaines opérations cartographiques telles que la décoration de carte, l'annotation de carte ne peuvent pas être implémentées dans ce workflow de traitement car le GML ne spécifie pas les styles d'affichage et de décoration. Alors que SVG est défini comme une norme graphique dans l'environnement réseau, il ne peut pas être correctement représenté l'information spatiale. Une fois que SVG a étendu sa représentation des informations spatiales telles que la position de la carte, l'analyse de la carte, la décoration de la carte et sa structure de données, il peut être utilisé pour satisfaire les caractéristiques de l'information spatiale (nous avons présenté lors d'une conférence précédente, 2008).

Même ainsi, il y a encore un problème rencontré dans le développement de la procédure, qui est de savoir comment mettre à jour ou modifier les ensembles de données pour divers projets dans le système du SVG WebGIS. Cela signifie qu'il est important de développer une architecture de système de services spatiaux et un cadre appliqué de SVG WebGIS afin d'organiser toutes les définitions, fonctions et extensions de SVG pour s'adapter ou mettre à jour pour diverses applications après la spécification SVG (Scalable Vector Graphics) étendu la représentation de l'information spatiale. Cet article proposait un document standardisé SVG comme cadre pour implémenter un projet WebGIS côté client. Il utilise d'abord le modèle de représentation spatiale basé sur SVG pour prendre en charge une représentation complète des informations spatiales pour SVG, puis un document standardisé SVG est défini dans un cadre de livraison spatiale du côté client du système. Ce cadre est considéré comme un système SVG WebGIS ou un projet qui peut être utilisé pour exécuter toutes les fonctionnalités telles que : définir la position de la carte, transformer la projection cartographique, analyser spatialement les cartes, décorer les cartes, etc. Les utilisateurs ne peuvent que préparer ou transformer leur données selon le document standardisé du modèle spatial SVG, il suffit donc de mettre à jour ou de charger leurs propres données spatiales dans le cadre, puis de mettre en œuvre le système avec toutes les fonctions mentionnées ci-dessus. Afin de donner une solution complète, il est également important de mentionner certaines stratégies de stockage telles que la base de données de visualisation SVG et le document standardisé du schéma d'application GML et sa gestion devait être améliorée pour améliorer l'efficacité du système. Enfin, le workflow d'une étude de cas est montré en utilisant le document standardisé SVG pour la mise en œuvre d'un projet WebGIS appliqué. Les résultats expérimentaux montrés, il est possible et facile de mettre à jour différents ensembles de données de SVG WebGIS pour la mise en œuvre pratique.

Mots-clés : SVG WebGIS SVG Information spatiale documentaire normalisée, module de données GML

FAUNE

SIG en ligne pour cartographier et comparer la répartition géographique des espèces de poissons des eaux douces et saumâtres en Afrique

Papertopic : SVG pour la cartographie Web et les SIG/GML en ligne

La biodiversité des espèces de poissons d'eaux douces et saumâtres en Afrique est à la fois très diversifiée et d'une grande importance régionale pour les moyens de subsistance et les économies. De nombreuses régions d'Afrique ne sont toujours pas bien étudiées, de sorte que les informations disponibles sur les espèces de poissons sont insuffisantes pour la planification de l'environnement et du développement. Le manque d'informations de base sur la répartition des espèces et leur statut de menace est depuis longtemps un obstacle majeur auquel sont confrontés les gestionnaires d'écosystèmes d'eau douce en Afrique. C'est pourquoi l'IRD a initié un projet de mise en place d'un SIG en ligne pour rassembler, stocker, gérer et diffuser largement les informations sur la répartition des espèces de poissons d'eaux douces et saumâtres en Afrique.

La construction du SIG a nécessité l'identification et la collecte de thèmes de données fondamentales pour l'ensemble du continent africain, qui sont des emplacements de points sur toutes les espèces connues, l'hydrographie, l'hypsographie, les frontières internationales, les noms géographiques et la couverture terrestre. Le manque d'ensembles de données géospatiales fondamentales précises, fiables et à jour ainsi que les problèmes causés par l'erreur, l'inexactitude et l'imprécision ont été le principal défi pour mettre en place l'application. La base de données contient actuellement environ 7000 sites d'échantillonnage répartis sur tout le continent, 3300 espèces distinctes et environ 120 000 enregistrements.

L'architecture et l'interface graphique permettant de cartographier et de comparer la répartition géographique des espèces de poissons au niveau continental jusqu'au site d'échantillonnage sont basées sur une API développée par carto:net. PostgreSQL est utilisé comme système de gestion de base de données relationnelle objet, PostGIS ajoute la prise en charge des objets géographiques et UMN MapServer fournit des couches de données raster. L'interface utilisateur graphique est entièrement conçue en SVG. Les données du serveur sont récupérées de manière asynchrone en arrière-plan sans interférer avec l'affichage et le comportement de la page existante chaque fois que l'utilisateur interagit avec l'interface graphique. La première version bêta de l'application est accessible à l'adresse http://www.ird.fr/poissons-afrique/faunafri/. Nous vous recommandons actuellement d'utiliser Microsoft Internet Explorer avec Adobe svg Viewer installé pour afficher la page.

Dans la version actuelle, chaque fois que l'utilisateur effectue un zoom ou un panoramique, l'application extrait de la base de données pour chaque couche visible un nouveau fragment SVG contenant la géométrie de la zone d'intérêt actuelle. Avant d'ajouter le contenu aux groupes de couches côté client, l'ancien contenu est supprimé. Si l'utilisateur retourne dans l'historique des vues pour revenir à une zone précédemment visitée, l'application recharge à nouveau le contenu à partir de la base de données. La même conception structurelle est utilisée pour les données raster.

La présentation présentera une méthode basée sur des tuiles pour demander la géométrie à la base de données afin d'éviter de charger deux fois le même contenu. Nous avons l'intention de mettre en pratique l'approche par tuiles dans la version finale de l'application FAUNAFRI pour les couches vectorielles et raster.

Le projet a reçu des fonds de l'IRD sous la responsabilité scientifique de D. Paugy. Ici, nous voudrions en particulier reconnaître les contributions majeures au projet fournies par N. Rahmani, L. Ruhier, J.J. Troubat et M. Vienne.

Génération et utilisation de cartes météo SVG

Papertopic : SVG pour la cartographie Web et les SIG/GML en ligne

Auteur(s) : Siemens, Stephan (ECMWF)

Le Centre européen de prévisions météorologiques à moyen terme (ECMWF) est une organisation internationale qui fournit à ses organisations membres des prévisions à moyen terme de 3 à 15 jours. Dans le cadre de sa mission, l'ECMWF fournit également des logiciels pour accéder, manipuler et visualiser ses données. Le Magie++ La bibliothèque graphique, disponible gratuitement sous licence Apache, est développée par l'ECMWF pour afficher des champs de prévisions météorologiques numériques et des données d'observation sur des cartes géographiques.

Actuellement, le format de sortie graphique principal pour les pages Web est PNG et PostScript pour l'impression. Pour offrir un format plus interactif pour le Web, un format vectoriel est nécessaire pour permettre le zoom dans les affichages détaillés des données. La possibilité d'intégrer la sortie SVG directement dans les pages Web et la possibilité d'ajouter de l'interactivité aux affichages via JavaScript, ainsi que l'ouverture du format sont autant d'avantages.

La présentation montrera des exemples de cartes météorologiques SVG générées avec Magics++ et expliquera comment ces fichiers SVG sont prévus pour être utilisés sur le Web directement ou indirectement via un service de carte Web OGC (WMS). Des exemples sont montrés comment les cartes SVG peuvent réduire la communication client-serveur. Les problèmes de développement du pilote de sortie SVG dans Magics++ sont également abordés.

Les SVG générés par Magics++ contiennent également des informations supplémentaires pour séparer les différentes parties de l'intrigue en couches telles que comprises par inkscape. Cela facilite l'édition des cartes météorologiques pour la publication.

GVG - Visualiser les données GDML en SVG

Papertopic : SVG pour la cartographie Web et les SIG/GML en ligne

GVG (Governmental data visulization in SVG) est une application fonctionnant dans la plupart des navigateurs Web populaires. Cette application a pour objectif de visualiser les données statistiques de cartographie du gouvernement pour chaque état par temps, en utilisant SVG pour afficher et interagir. Il est utile pour les utilisateurs, en particulier pour les gouverneurs, d'examiner les données statistiques gouvernementales et de prédire les tendances de l'économie, de l'emploi, même de la propagation des maladies, etc.

Dans cet article, un nouveau format XML appelé GDML (Governmental Data Markup Language) est introduit pour stocker des données statistiques gouvernementales telles que le taux de chômage, le taux d'inflation, etc. Les utilisateurs peuvent télécharger un fichier GDML validé sur cette application basée sur un navigateur, dans laquelle SVG rend une carte du pays composée de tous les États. Dans cette carte, chaque état serait entièrement ou partiellement rempli de gradient pour représenter les données statistiques. Sous la carte, il y a une barre de défilement avec des marques d'une période de temps (par exemple : de janvier 2009 à décembre 2009). Lorsque le curseur se déplace, le dégradé met à jour dynamiquement la région remplie en fonction du fichier GDML téléchargé. Un événement de clic sur un état affiche des informations plus détaillées sur cet emplacement. Pour la fonction de vue détaillée, une couche à faible opacité représentant les informations s'affichera en haut de la carte. La vue détaillée contient des données textuelles sur l'état sélectionné, ce qui peut aider les utilisateurs à bien comprendre les données et à faire une prédiction précise.

Aperçu

Qu'est-ce que GDML

GDML est un langage de description de données statistiques gouvernementales en XML. Pour l'utilisation de GVG, GDML peut décrire le taux de chômage, l'inflation (en termes de gaz ou de maison ou autres) et les salaires et avantages. Étant donné que GDML est un langage basé sur XML, il est bien défini dans DTD (Document Type Definition) et le fichier GDML devient un outil productif pour décrire, stocker et transmettre des données statistiques gouvernementales, qui peuvent être facilement créées et modifiées. De plus, en tant que principal avantage du fichier basé sur XML, le document GDML se compose entièrement de caractères du répertoire Unicode. En d'autres termes, tout caractère défini par Unicode peut apparaître dans le contenu d'un document GDML, ce qui est très important pour les gouvernements de différents pays utilisant différentes langues, comme l'anglais, le français et le chinois.

Architecture

1. Pré-rendu - création de fichiers de données GDML
2. Rendu SVG via Javascript
3. Gestion des événements Javascript

Pré-rendu - création de fichiers de données GDML

Les données GDML peuvent être facilement récupérées sur le site Web du gouvernement, par exemple : United States Department of Labor à l'adresse http://www.dol.gov . Les données pourraient être extraites de sa base de données et enregistrées dans des fichiers (au format txt ou xls). Selon ces données, un fichier GDML pourrait être créé, comprenant des informations clés et toutes les données statistiques sur chaque état, telles que : le nom du pays, le nom de l'état, le type de données, l'heure des données et la valeur des données. Un GDML validé, conforme à la DTD GDML, est prêt à être téléchargé et affiché dans l'application GVG.

Rendu SVG via Javascript

Dans GVG, une carte de pays svg est incluse, composée de tous les états indiqués par son abréviation. Et pendant l'événement onload() de cette carte svg, l'application chargera le fichier de données GDML dans un objet DOM XML JavaScript et effectuera le chargement des données. L'application accède à l'objet DOM et crée un objet associatif pour chaque état du pays, dans lequel toutes les données statistiques seraient stockées dans différents tableaux en tant que membres de l'objet en fonction de la catégorie de données. Les noms des objets sont associés à l'état dans son abréviation (par exemple, CA, TX, etc.), donc une fonction appelée render () serait déclenchée pour rendre chaque état de la carte en fonction des objets créés ci-dessus. Tout d'abord, il localiserait chaque état unique dans la carte à l'aide de la fonction SVG DOM, puis, selon le type de données sélectionné à afficher, il extrairait la valeur des données de l'objet correspondant, enfin, sur la base de ces valeurs, chaque état dans la carte, appliquer des remplissages en dégradé au rendu différemment et montrer clairement la situation et le statut variés.

Gestion des événements Javascript

Maintenant, tous les états sont identifiés et rendus. Faire glisser ou cliquer sur la barre du curseur temporel sous la carte modifierait les remplissages en dégradé représentant différentes situations ou états dans le temps, en fonction de la valeur des données dans différentes périodes. Lorsque la souris est relâchée lorsque le curseur temporel se déplace, la fonction render() est à nouveau appelée pour rendre chaque état lorsque la valeur des données sélectionnées change. Pendant que le curseur se déplace et que les remplissages dégradés sont modifiés, une tendance claire serait clairement affichée.

De plus, cliquer sur chaque état activerait une vue pour des informations détaillées pour cet emplacement. Sur le côté droit de la carte, il y a une boîte rectangulaire contenant des données textuelles, javascript mettrait à jour ces informations détaillées en fonction de l'événement de souris onClick().

Référence

[1] Département du Travail des États-Unis. http://www.dol.gov/

[4] Anh Trinh. StatsVG - Visualisez les données statistiques via Vector Graphy. SVG Ouvert 2009

[5] Nikolas Plutôt, Vladimir Geroimenko, Chaomei Chen. Springer. Visualisation des connaissances à l'aide de graphiques SVG dynamiques.

[6] Shane Aulenback, Vladimir Geroimenko, Chaomei Chen. Springer. SVG comme interface visuelle des services Web.

Liens entre SVG et outils ouverts ou gratuits dans un SIG en ligne

Papertopic : SVG pour la cartographie Web et les SIG/GML en ligne

Auteur(s) : Connan, Christophe (SMA Netagis)

Introduction : SVG et SIG, outils externes.

Cette présentation débutera par une brève explication sur le choix d'utiliser SVG comme outil d'affichage dans un SIG en ligne (génération facile, affichage vectoriel/raster, scripting, technologie libre. ). Cette introduction soulignera également la place centrale du SVG dans ce type d'architecture logicielle et les liens potentiels entre SVG et d'autres outils ouverts ou libres.

SVG / LAMP : Une histoire côté serveur.

LAMP (pour Linux-Apache-Mysql-Php) est une pile solide, gratuite et facilement installable pour construire le générateur SVG qui sera utilisé pour la cartographie Web. Les fragments SVG sont créés par des scripts PHP à partir de données extraites d'une base de données MySQL. Diverses bibliothèques PHP peuvent être utilisées pour manipuler SVG sous forme de texte ou d'élément DOM. L'architecture LAMP permet également de transmettre le SVG généré vers le client en utilisant le protocole HTML.

SVG / Mapserver : Si vous voulez que quelque chose soit bien fait, laissez les autres le faire eux-mêmes.

Mapserver est un logiciel gratuit – sa première utilisation est de générer des images géolocalisées à partir d'images plus grandes ou de fichiers et bases de données SIG. En fonction des couches affichées dans le SVG et de la position de la carte, les URL des images sont générées et envoyées à mapserver. L'image résultante est ensuite insérée dans le document svg.

SVG / Batik : Un rastériseur utile mais strict.

Il est parfois difficile de réutiliser le svg généré une fois qu'il a été analysé et affiché par le client svg-viewer, en particulier lorsque vous avez besoin d'une image bitmap. Dans ce cas, il est possible d'utiliser un outil de rastérisation. Celui que nous illustrons ici est le Batik Rasterizer. Batik est un programme basé sur Java qui fournit des outils pour manipuler des documents SVG.

SVG / Viewers et plugins : Tout faire mais pas avec tout.

Il existe de nombreux outils pour afficher svg dans un navigateur Web, mais ils ne sont pas tous égaux. Un objectif lors de la mise en œuvre d'un SIG basé sur SVG est de trouver le bon visualiseur SVG avec suffisamment de capacités (affichage ou script) compatibles avec la plupart des matériaux des utilisateurs. Ensuite, plusieurs scripts peuvent être écrits pour ajouter de l'interactivité à la carte, comme des zooms, un panoramique ou la création de svg côté client

Etude de cas : Génération d'un document PDF A0.

Une bonne façon de résumer cette présentation est de montrer un exemple complet. Nous allons générer un document PDF en utilisant un SIG basé sur SVG et les quatre outils énumérés ci-dessus.

Conclusion : Autres outils, avantages et inconvénients.

Présentation rapide de quelques autres gratuits et ouvre des outils utilisables avec SVG. Mise en évidence de multiples possibilités mais mise en garde sur les difficultés et incompatibilités qui peuvent être rencontrées.

Localisateur interactif de zone d'intérêt à faible coût

Papertopic : SVG pour la cartographie Web et les SIG/GML en ligne

Ce projet se concentre sur un sous-ensemble des problèmes de cartographie. Nous nous concentrons sur les problèmes de localisation appliqués à la structure physique où il existe une représentation de la carte, qui a une zone d'intérêt qui doit être rapidement accessible et rendue évidente. Par exemple, un acheteur dans un centre commercial peut vouloir savoir où se trouve un magasin spécifique. Usually they need to look up the directory of the mall, and spend a significant time locating the numbers presented in the index onto the map. Another case is locating the shelf for a specific book in a library.

As a specific example, we focus on book location. Libraries have their books, journals, articles, multimedia collections, and various other items categorized and placed on the shelves with related topics. However, when someone who is not familiar with the shelves' location, finding the needed book or item will be time consuming or even frustrating. There is an open research field trying to address this problem. Some approaches used Radio Frequency Identification (RFID) technology with Bluetooth [ChoiOh05], while others used Infrared Data (IrDA) Association communication modules with Light Emitting Diode (LED)[ChoiOh09], or use GPS [Aittola03]. However, these methods will be costly since libraries need to install these systems on all the shelves and books in the library. Therefore, I propose to use the library's existing unique barcode system which identifies books within the library.

This research is conducted at the Mountain View Public Library. All the ID ranges of the books are read and stored in a database, and then the data would be used to generate the exact shelves on the library. We use SVG to display the aisle and shelf of the book or library item. I introduced a new way to locate each of the items in the library by utilizing the existing library's items' IDs.

Development and Implementation

We incorporate the existing maps data with SVG and JavaScript to create a lower cost interactive mapping system. The main advantage of using SVG is that it is scalable, which means the ability to zoom in and out without losing quality. Moreover, the free Inkscape software can be used to draw the map into SVG file and assign for each region of interest a unique ID. Inkscape is fairly simple to use, and it allows users to set attributes and properties in the region drawn. Another reason is that SVG is available directly in the browser, so there is no other download tool needed. Microsoft has also joined other browsers and announced that they are going to start supporting SVG in their Internet Explorer 9.

The mapping between ID codes and location is stored in a MySQL database. An Apache server running PHP provides the pages where the administrators can update or add locations for items. Behind the scenes, SVG, HTML, and JavaScript update the map after processing user input.

In addition, another special web page allows users to interact with the map. When looking up an item of interest (in the case of a library this could be a book, whereas in the case of a mall, it could be a store), users are able to type in names, IDs, or aisle numbers into the application and the specific area of the map will be highlighted.

The lookup and highlighting is implemented in JavaScript, using the jQuery and jQuery.svg libraries. AJAX allows refreshing the map without needing to reload the page. When queried by jQuery, a PHP page sends an XML response which contains the error code, and if no error occurred, it has the ID of the element to be highlighted in the SVG map.

Example 1: The queried book was found in asile with the id "aisle50":

Example 2: The querried book was not found in the database:

<message>Item Not Found</message>

This application is useful since libraries or stores rearrange their aisles from time to time, and items could be moved to a different area without notice. In addition, since we allow item-level granularity, if the library upgrades to a RFID tagging system, then the location of the books could be updated automatically.

The only requirements needed for this application to work are: a map of the library or store must be available, and if not created and saved in the SVG file format with the appropiate IDs set for the areas of interest (i.e., aisles) and a database which maps the item ID to an area ID (i.e., book number to aisle ID). For the Mountain View library case study, it took about three hours to collect the aisle range data for each one of the floors. The total estimated time to create the map, and the mapping from scratch is under a day (assuming that a graphic artist is available to draw the map). The setup time of the software is less than an hour, which makes our software very appealing for non-profit organizations.

[ChoiOh09] Jung-Wook Choi and Dong-Ik Oh. "Tag-only aging-counter localization for the R-LIM2 system". Springer Netherland. March 10, 2009.

[ChoiOh05] Jung-Wook Choi and Dong-Ik Oh. "Development of an RFID based library management and search system". Journal of the Korean Academic Industrial Society. June 2005. pp. 105-109.

[Aittola03] Markus Aittola, Tapio Ryhanen, and Timo Ojala. "SmartLibrary - Location-Aware Mobile Library Service". Springer-Verlag. September 2003. pp. 411-416.

[ChoiOh06] Jung-Wook Choi, Dong-Ik Oh, and Il-Yeol Song. "R-LIM: an Affordable Library Search System Based on RFID". 2006 International Conference on Hybrid Information Technology. November 11, 2006. pp. 103-108.

[Raubal02] Martin Raubal and Stephan Winter. "Enriching Wayfinding Instructions with Local Landmarks". Springer Berlin / Heidelberg. vol. 2478. September 2002. pp. 243-259.

[Elias03] Birgit Elias. "Extracting Landmarks with Data Mining Methods". Springer Berlin / Heidelberg. vol. 2825. October 2003. pp. 375-389.


Voir la vidéo: GIS with Openlayers part1. How to add #GeoJSON on #Openlayers map?