Widget Google Maps


Apps - Widget - Google Maps icon.png  Ce type de widget appartient à la catégorie Dashboards de la bibliothèque des widgets. Pour une mesure donnée, il permet de géolocaliser sur une carte des emplacements (pays, villes, adresses, …) liés à des données statistiques, en utilisant le service de cartographie en ligne Google Maps.

En mode Exécution, l'affichage se décompose en 2 zones :

  • la carte géographique (1) sur laquelle sont placées les pastilles de géolocalisation (1) :
    • une bulle d'information est affichée en survolant chaque emplacement géolocalisé ;
    • la position de l'utilisateur connecté est repérée via une pastille bleue (2).
  • une barre d'outils Transports (optionnelle) (2), indiquant, pour chaque mode de transport sélectionné, les temps de déplacement entre l'un des emplacements géolocalisés sur la carte et la position actuelle de l'utilisateur.

         EVApps - widget Google Map - Description.png

Remarques

Open url.png  voir Remarques générales sur les widgets

  • Le datasource doit comporter : une ou plusieurs colonnes Dimension identifiant les emplacements ; une colonne Mesure : Valeur observée.
  • Les propriétés à renseigner dépendent de la façon dont sont définis les emplacements dans le datasource :
    • localisation de dernier niveau : renseignez la propriété Content > Address ;
    • localisation reconstruite à partir des différents éléments d'adresse d'Product name - ev itsm.png lorsque le datasource pointe vers une vue liée à la table AM_LOCATION : renseignez la propriété Content > Address en sélectionnant le champ virtuel Full Address (<Nom_table>) ;
    • coordonnées latitude/longitude : renseignez les propriétés Content > Latitude et Content > Longitude ;
    • adresse postale : renseignez la propriété Content > Address.
  • Lorsque les informations de transport sont affichées, le navigateur peut demander l'autorisation de récupérer la position courante de l'utilisateur pour le géolocaliser.
    • Il est conseillé d’activer en permanence cette autorisation pour le site Product name - ev sas.png.
    • Vous pouvez par la suite modifier cette permission d'accès -   Open url.png  voir Procédure suivant votre navigateur
  • En mode Exécution, il peut être nécessaire de zoomer pour afficher les informations relatives au trafic routier et aux transports publics. La mention n/a indique que l'information ne peut pas être calculée.

Best Practice big icon.pngBonnes pratiques

  • Utilisez le widget Google Maps lorsque vous souhaitez afficher des valeurs sur une carte.
  • Utilisez un style de carte allégé, permettant de mettre en évidence les valeurs (propriété Visualization > Style Editor).
  • Créez un Custom widget si vous souhaitez conserver le style de carte et le réutiliser sur d'autres widgets.

Exemple

Pour chaque filiale en Amérique du Nord (les éléments de dimension), afficher le nombre d'incidents (la mesure) sur une carte de géolocalisation. Le datasource ci-dessous comprend les différentes formes possibles pour définir les emplacements (localisation de dernier niveau, adresses nommées, latitude/longitude).
     Open url.png  voir Procédure pour renseigner les propriétés suivant la structure de votre datasource

Datasource Widget Google Maps

EVApps - widget Google Map - Example DataSource.png

Download Zip icon.png Téléchargez Exemple (fichier CSV)

EVApps - widget Google Map - Example Chart.png

Liste des propriétés

Content

DataSource

DataSource : Source de données externes liée au widget. 

  • La liste déroulante affiche tous les datasources disponibles dans l'application. 
  • Pour modifier le datasource ou visualiser son contenu, cliquez sur Apps - Edit icon.png. Le bouton Apps - datasources Properties - Preview button.png sous la propriété Configure Field Types affiche le nombre de lignes (maximum 15) et de colonnes extraites.
  • Pour définir un nouveau datasource, cliquez sur Apps - Add datasource icon.png Add Data Source dans le volet Objets.
DataTransformer

Data Transformer : Permet de définir la structure et le périmètre du datasource, d'appliquer des fonctions d'agrégation statistiques et de modifier l'ordre d'affichage des mesures.

  • Cliquez sur Setup / Preview Data sous la propriété Data Transformer pour ouvrir la fenêtre dédiée -  Open url.png  voir Description

Latitude : Colonne du datasource où sont stockés les coordonnées de latitude.

Longitude : Colonne du datasource où sont stockés les coordonnées de longitude.

Address: Colonne du datasource où sont stockés les localisations de dernier niveau ou les adresses nommées (pays, ville, etc.). Note :  Lorsque le datasource pointe vers une vue liée à la table AM_LOCATION, vous pouvez utiliser le champ virtuel Full Address (<Table_name>) -  Open url.png  voir Remarques générales sur les widgets

Value : Colonne du datasource où sont stockées les valeurs de la mesure.

Tooltip Label : Colonne du datasource où sont stockés les libellés des emplacements. Note : Ces libellés sont affichés dans les bulles informatives sur la carte.

Data

MaximumNumberOfDisplayedData

Maximum Number Of Displayed Data : Pour chaque mesure sélectionnée dans le datasource, indique le nombre maximal d'éléments de dimension à afficher, pour éviter que le graphique ne devienne illisible.

Example documentation icon FR.png  Afficher un diagramme à barres des incidents et des demandes par employé  - Open url.png voir champ Maximum Number Of Data

  • Le comptage est toujours effectué à partir du premier élément de dimension.
  • Lorsque le nombre d'éléments de dimension à afficher est inférieur au nombre d'éléments de dimension à charger, un élément de dimension Autres est ajouté automatiquement au diagramme : il comprend le cumul des valeurs de tous les éléments de dimension non affichés.

Visualization

Style Editor : Code XML décrivant le style de carte. Saisissez directement le code dans la zone ou cliquez sur Apps - Edit Html icon.png pour afficher la liste des styles disponibles. Note : Pour éviter toute erreur lors de l'insertion d'un style de carte, faîtes un copier-coller du code XML disponible sur le site Internet qui le propose.

   Open url.png  voir le site snazzymaps

   EVApps - widget Google Map - Style editor.png

User Position : Lorsque l'application permet d'accéder à des informations de trafic, indique si la position de géolocalisation de l'utilisateur connecté doit être affichée sur la carte (case cochée - la position est repérée sur la carte via Localization icon.png) ou non (case non cochée).

Show Travel Time (Note : Uniquement si la case User Position est cochée) : Indique si la barre d'outils Transports doit être affichée (case cochée) ou non (case non cochée).
         EVApps - widget Google Map - Transportation toolbar.png

Public Transportation : Indique si les informations relatives aux transports en commun doivent être mises à disposition de l'utilisateur (case cochée) ou non (case non cochée). En mode Exécution :

  • l'utilisateur a la possibilité d'afficher, ou non, les informations, en cochant la case en regard de l'icône EVApps - widget Google Map - Public transportation icon.png ;
  • une liste accessible via Black Up arrow icon.png lui permet de sélectionner le mode de transport souhaité.
             EVApps - widget Google Map - Public transportation.png     EVApps - widget Google Map - Public transportation toolbar.png

Traffic : Indique si les informations relatives au trafic routier doivent être mises à disposition de l'utilisateur (case cochée) ou non (case non cochée). En mode Exécution :

  • l'utilisateur a la possibilité d'afficher, ou non, les informations, en cochant la case en regard de l'icône EVApps - widget Google Map - Private transportation icon.png ;
  • une liste accessible via Black Up arrow icon.png lui permet de sélectionner le mode de transport souhaité.
              EVApps - widget Google Map - Traffic.png  

Auto Fit Marker : Indique si le niveau de zoom par défaut appliqué à la carte en mode Exécution doit s'ajuster automatiquement pour que toutes les pastilles tiennent à l’écran (case cochée) ou non (case non cochée - dans ce cas, renseignez le niveau de zoom par défaut via la réglette Zoom Level).

Zoom Level (Note : Uniquement si la case Auto Fit Marker n'est pas cochée) : Réglette permettant de définir manuellement le niveau de zoom par défaut appliqué à la carte en mode Exécution.

Visualization Type : Type des marqueurs de géolocalisation placés sur la carte :

  • Image : Pastille variant suivant le modèle de marqueurs sélectionné (via la propriété Image > Select Map Marker).
  • Circle : Cercle dont la taille est proportionnelle à la valeur qu'il représente.
    • Utilisez la propriété Circle > Maps Thresholds pour définir des couleurs différentes suivant des seuils de valeurs.
    • Lorsque les informations sont trop proches les unes des autres, elles sont regroupées ; le cercle apparaît alors sous la forme Cluster icon.png (1). Il est alors nécessaire de zoomer pour affiner l'affichage et visualiser les valeurs (2). Note : La proximité géographique est gérée par Google Maps qui décide si l'espace est suffisant pour afficher plusieurs cercles ou au contraire tout regrouper en un cercle unique.
               EVApps - widget Google Map - Marker Circle Cluster.png
  • PinCircle : Pastille à l'intérieur de laquelle est inscrite la valeur. Note : Utilisez la propriété Circle > Maps Thresholds pour définir des couleurs différentes suivant des seuils de valeurs.
Image Circle PinCircle
EVApps - widget Google Map - Marker Image.png EVApps - widget Google Map - Marker Circle.png EVApps - widget Google Map - Marker PinCircle.png

Image

Note : Propriétés disponibles uniquement si le marqueur est de type Image.

Select Map Marker : Modèle de marqueur utilisé, sélectionné dans la bibliothèque d'images fournie par Logo - EasyVista.png.

Circle

Note : Propriétés disponibles uniquement si le marqueur est de type Circle ou PinCircle.

Maps Thresholds : Permet de définir des couleurs différentes pour les pastilles suivant des seuils de valeurs.
         Apps - widget Google Maps - Thresholds.png

  • Saisissez chaque valeur marquant un changement de couleurs.
  • Cliquez sur chaque pastille puis sélectionnez la couleur souhaitée via le Color Picker.

Color Opacity (0.1 - 1.5) : Réglette permettant de définir le degré de transparence des pastilles.

Text Police Size (10 - 15) : Réglette permettant de définir la taille de la police des valeurs inscrites à l'intérieur des pastilles.

Theme

Open url.png  voir Description des propriétés

Procédures

 

Comment renseigner les propriétés relatives aux emplacements

         EVApps - widget Google Map - Example DataSource.png

  • Propriétés à renseigner lorsque les emplacements sont définis par des localisations de dernier niveau :
    • Address : Location
    • Value = Nbr of Incidents
  • Propriétés à renseigner lorsque les emplacements sont définis par des coordonnées latitude/longitude :
    • Latitude : Latitude
    • Longitude : Longitude
    • Value = Nbr of Incidents
  • Propriétés à renseigner lorsque les emplacements sont définis par des adresses postales :
    • Address : Address
    • Value = Nbr of Incidents

 

Comment modifier la permission de géolocalisation accordée au site Product name - ev sas - big.pngev Service Apps

Sous Firefox

1. Allez sur le site Product name - ev sas.png.

2. Ouvrez le menu Outils > Informations sur la page et sélectionnez l'onglet Permissions.

3. Changer le paramètre Accéder à votre position.

Sous Chrome

1. Dans la barre d'outils du navigateur, cliquez sur le menu Chrome Google Chrome Menu icon.png.

2. Sélectionnez l'onglet Paramètres puis cliquez sur Afficher les paramètres avancés.

3. Dans la section Confidentialité, cliquez sur Paramètres de contenu ; dans la section Localisation, sélectionnez l'autorisation par défaut souhaitée pour les prochaines demandes de localisation, puis cliquez sur [ OK ].

Note : Cliquez sur Gérer les exceptions pour supprimer des autorisations accordées précédemment à certains sites.

Sous Internet Explorer

1. Dans la barre d'outils du navigateur, cliquez sur l'icône Internet Explorer Parameters icon.png puis sur Options Internet.

2. Cliquez sur l'onglet Sécurité.

3. Dans la zone Paramètres de sécurité, cliquez sur Sites de confiance puis sur le bouton [ SITES ].

4. Définissez vos autorisations :

  • pour ajouter une autorisation : saisissez l'adresse du site souhaité puis cliquez sur [ AJOUTER ] ;
  • pour supprimer une autorisation : sélectionnez l'adresse du site souhaité puis cliquez sur [ SUPPRIMER ].
Tags:
Modifié par Utilisateur inconnu le 2017/07/27 10:28
Créé par Administrator XWiki le 2014/09/02 11:48

Raccourcis

L'actualité mensuelle
•  Newsletter

Tous les changements
•  Service Manager
•  Service Apps
•  Self Help

Glossaire

Powered by XWiki ©, EasyVista 2020