Afficher les images dans des fenêtres contextuelles

Vidéo

Ce didacticiel est également disponible sous forme de vidéo.

Publier un shapefile en tant que couche d’entités hébergée

Vous commencerez par télécharger un fichier .zip comportant les données de ce didacticiel. Vous téléchargerez le shapefile vers ArcGIS Online en tant que couche d’entités.

  1. Téléchargez le fichier show_images_in_pop_ups.zip et décompressez-le dans un emplacement de votre ordinateur (par exemple, l’unité C).
  2. Ouvrez le dossier show_images_in_pop_ups décompressé.

    Le dossier contient deux fichiers : historic_lakes.zip et Lop_Nur.jpg.

    Fichiers Lop_Nur.jpg et historic_lakes.zip

    Ne décompressez pas le fichier historic_lakes.zip. Il contient un shapefile, un format de données spatiales consistant en plusieurs fichiers. Pour utiliser ces données dans une carte Web ArcGIS Online, vous devez charger une copie compressée du shapefile.

  3. Connectez-vous à votre compte d’organisation ArcGIS.
    Remarque :

    Si vous ne disposez pas d’un compte d’organisation, consultez les options disponibles pour accéder aux logiciels.

  4. Sur le ruban, cliquez sur l’onglet Content (Contenu).
  5. Cliquez sur le bouton New item (Nouvel élément).

    Bouton New item (Nouvel élément)

  6. Faites glisser le fichier historic_lakes.zip vers la fenêtre New item (Nouvel élément).
    Conseil :

    Vous pouvez également cliquer sur Your device (Votre appareil) et accéder au fichier .zip.

  7. Assurez-vous que File type (Type de fichier) est défini sur Shapefile et How would you like to add this file? (Comment souhaitez-vous ajouter ce fichier ?) sur Ajouter historic_lakes.zip et créer une couche d’entités hébergée.

    Paramètres File type (Type de fichier) et How would you like to add this file settings? (Comment souhaitez-vous ajouter ce fichier ?)

    Cette option crée deux éléments dans votre compte ArcGIS Online. L’un d’entre eux est une copie du shapefile. L’autre est une couche d’entités créée à partir du contenu du shapefile. Les données doivent être au format de couche d’entités afin de pouvoir être utilisées pour créer des cartes dans ArcGIS Online.

  8. Cliquez sur Next (Suivant).
  9. Pour Title (Titre), saisissez Lacs historiques, suivi de vos initiales (par exemple, Lacs historiques NP).
    Remarque :

    Il n’est pas possible de créer deux couches du même nom dans une organisation ArcGIS. Ajoutez vos initiales au nom de la couche pour permettre aux autres membres de votre organisation de suivre ce didacticiel. Une fois la couche créée, vous pouvez la renommer sur la carte pour supprimer vos initiales, ce qui n’a pas d’impact sur le nom de la couche de données sous-jacente.

  10. Pour Summary (Résumé), saisissez Données issues de naturalearthdata.com.

    Détails de l’élément dans la fenêtre New item (Nouvel élément)

    Ces détails peuvent être modifiés par la suite.

  11. Cliquez sur Next (Suivant).

    La page d’élément de la nouvelle couche d’entités apparaît. Le nom de l’élément est Historic Lakes (Lacs historiques) et le type de l’élément est Feature Layer (hosted) (Couche d’entités (hébergée)).

    Type d’élément Feature Layer (hosted) (Couche d’entités (hébergée))

    Les éléments hébergés sont des éléments de couche source. Ils représentent un jeu de données, tandis que les éléments non hébergés ne référencent qu’un jeu de données. Si vous supprimez une couche d’entités hébergée, les données sont également supprimées. Si vous supprimez une couche d’entités non hébergée, seule la couche est supprimée et les données restent accessibles pour d’autres couches à référencer.

    Seule s’affiche l’étiquette (hosted) ((hébergée)) lorsqu’un élément qui vous appartient est hébergé.

    Remarque :

    Si vous disposez d’un compte d’administrateur, l’étiquette (hosted) ((hébergée)) s’affiche pour les éléments appartenant à n’importe quel utilisateur dans votre organisation.

    Reportez-vous à la documentation pour en savoir plus sur les couches d’entités et les couches d’entités hébergées.

    Parce que cette couche est hébergée par vous et vous appartient, vous pouvez gérer les fonctionnalités et la structure des données, plutôt qu’uniquement les propriétés de la couche. Vous en profiterez par la suite, lorsque vous modifierez les données pour inclure des images.

Examiner les données

Vous allez maintenant afficher la couche d’entités Historic Lakes (Lacs historiques) en tant que table et en tant que carte. Vous allez évaluer les fenêtres contextuelles par défaut afin de voir si elles fonctionneraient bien pour votre carte.

  1. Sur la page d’élément Historic Lakes (Lacs historiques), sur le ruban, cliquez sur l’onglet Data (Données).

    Onglet Données

    Une table apparaît, affichant les attributs de la couche. Elle ne contient que deux champs : Webpage (Page Web) et Name (Nom). Vous allez ensuite afficher ces données sur une carte.

  2. Sur le ruban, cliquez sur l’onglet Visualization (Visualisation).

    Une carte du monde apparaît. Elle montre une couche de polygones de quatre lacs.

  3. Sur la carte, effectuez un zoom avant et cliquez sur l’une des entités de lac.

    Fenêtre contextuelle du lac Chad

    Une fenêtre contextuelle apparaît. Elle répertorie les attributs Name (Nom) et Webpage (Page Web) de la table. L’attribut Webpage (Page Web) représente un lien vers une page Wikipédia, et non pas le texte d’URL que vous avez vu dans la table. Vous souhaitez également inclure des images dans la fenêtre contextuelle.

  4. Dans la barre d’outils Contents (Contenu) (foncée), cliquez sur le bouton Layers (Couches).

    Couches sur la barre d’outils Contenu

    Dans le volet Layers (Couches), la barre bleue en regard du nom de la couche Historic Lakes (Lacs historiques) vous indique qu’elle est sélectionnée.

  5. Dans la barre d’outils (claire) Settings (Paramètres), cliquez sur le bouton Pop-ups (Fenêtres contextuelles).

    Bouton Pop-ups (Fenêtres contextuelles) dans la barre d’outils Settings (Paramètres)

    La fenêtre Pop-ups (Fenêtres contextuelles) répertorie deux éléments de contenu : Title (Titre) et Fields list (Liste de champs). Il s’agit de la configuration par défaut d’une fenêtre contextuelle, mais vous pouvez la définir afin d’afficher plus de contenu, y compris des images.

  6. Dans la fenêtre Pop-ups (Fenêtres contextuelles), cliquez sur Add content (Ajouter du contenu). Cliquez sur Image.

    La fenêtre Configure image (Configurer l’image) apparaît. Le premier contrôle vous permet de saisir l’URL d’une image. Toutefois, si vous ajoutez une image par cette méthode, chaque entité montrera la même image. Puisque vous souhaitez afficher une image différente pour chaque lac, cette méthode ne correspond pas à vos besoins.

  7. Fermez les fenêtres Configure image (Configurer une image) et Pop-ups (Fenêtres contextuelles).

Ajouter de nouveaux champs à la couche d’entités

Vous pouvez ajouter des images à chaque fenêtre contextuelle en modifiant les attributs de la couche. Vous allez ajouter deux nouveaux champs à la couche d’entités : un pour stocker les URL des images et un autre pour stocker le texte qui crédite la source de chaque image.

  1. Sur le ruban, cliquez sur l’onglet Données.

    La vue de table réapparaît. Vous allez ajouter un nouveau champ pour stocker les URL des images.

  2. Sur l’en-tête de la table, cliquez sur le bouton Options. Cliquez sur Ajouter un champ.

    Add Field (Ajouter un champ) dans le menu Options

    L’option Add Field (Ajouter un champ) est disponible car la couche Historic Lakes (Lacs historiques) vous appartient et est hébergée par vous.

  3. Dans la fenêtre Add Field (Ajouter un champ), pour Field Name (Nom du champ), saisissez Image. Pour Display Name (Nom d’affichage), saisissez Image.
  4. Vérifez que Type est défini sur String (Chaîne).

    Fenêtre Add Field (Ajouter un champ)

    Les champs String (Chaîne) stockent du texte. Les autres types de champ vous permettent de stocker des dates ou des nombres.

  5. Cliquez sur Ajouter un nouveau champ.

    Le champ Picture (Image) apparaît dans la table en tant que nouvelle colonne.

    Table avec la colonne Picture (Image)

  6. Cliquez de nouveau sur le bouton Options, puis sur Add Field (Ajouter un champ).
  7. Pour Field Name (Nom du champ), saisissez Source_image. Pour Display Name (Nom d’affichage), saisissez Source de l’image.

    Il existe des règles à propos du type de texte autorisé dans un champ Field Name (Nom du champ) (par exemple, les espaces sont interdits). Cependant, le Display Name (Nom d’affichage) est le nom allant apparaître dans la table et les fenêtres contextuelles.

  8. Pour Type, sélectionnez String (Chaîne).

    Fenêtre Add Field (Ajouter un champ)

  9. Cliquez sur Ajouter un nouveau champ.

    La table contient à présent quatre colonnes.

Ajouter des images aux données à l’aide d’URL

Vous allez maintenant remplir les nouveaux champs avec des URL et du texte de crédit pour chaque image.

  1. Dans la table, double-cliquez sur l’une des cellules Picture (Image) ou Image source (Source d’image).

    La cellule devient modifiable.

    Cellule modifiable dans la table

  2. Copiez et collez le texte suivant dans la table :

    NomImageSource d’image

    Mer d’Aral

    https://upload.wikimedia.org/wikipedia/commons/9/9f/Aral_Sea.gif

    Données de NordNordWest, NASA, United States National Imagery and Mapping Agency, www.unimaps.com

    Lac Texcoco

    https://upload.wikimedia.org/wikipedia/commons/a/a6/Lake_Texcoco_%28Lago_de_Texcoco%29_December_1855_map_from_Harper%27s_New_Monthly_Magazine_Volume_12_December_1855_to_May_1856_%28IA_harpersnew12harper%29_%28page_34_crop%29.jpg

    New York: Harper & Brothers Publishers (Harper’s New Monthly Magazine, volume 12, décembre 1855 à mai 1856), Brigham Young University-Idaho, David O. McKay Library

    Lac Chad

    https://upload.wikimedia.org/wikipedia/commons/9/94/ShrinkingLakeChad-1973-1997-EO.jpg

    NASA

    Lorsque des images sont utilisées dans des cartes, il est important d’inclure des informations créditant les personnes et les organisations à l’origine de ces images.

    Conseil :

    La prochaine fois que vous inclurez des images dans une couche d’entités, vous préférerez peut-être préparer la table avec leurs URL et le texte de crédit avant de l’ajouter à ArcGIS Online. Cela n’est cependant pas nécessaire.

Ajouter des images aux données à l’aide de pièces jointes

L’image du dernier lac, Lop Nur, n’est pas disponible en tant qu’URL. À la place, vous l’avez téléchargé avec le shapefile au début de ce didacticiel. Vous pouvez héberger l’image en ligne quelque part pour créer une URL ou la charger en tant que pièce jointe vers la couche d’entités. Dans ce didacticiel, vous allez ajouter l’image en tant que pièce jointe.

  1. Sur la page Historic Lakes (Lacs historiques), cliquez sur l’onglet Overview (Vue d’ensemble).
  2. Examinez la section Layers (Couches).

    Les couches d’entités (et les couches d’entités hébergées) consistent en une ou plusieurs sous-couches. La couche Historic Lakes (Lacs historiques) ne contient qu’une sous-couche, Historic_Lakes (Lacs_historiques). Les pièces jointes sont activées au niveau des sous-couches.

  3. Dans la section Layers (Couches), cliquez sur Historic_Lakes (Lacs_historiques).

    Sous-couche Historic_Lakes (Lacs_historiques)

    Une nouvelle page apparaît, affichant les paramètres de la sous-couche Historic_Lakes (Lacs_historiques).

    Remarque :

    Si l’erreur Unable to load (Chargement impossible) apparaît, fermez le message d’erreur.

  4. Sous Attachments (Pièces jointes), activez le paramètre Enable Attachments (Activer les pièces jointes).

    Paramètre Enable Attachments (Activer les pièces jointes) activé

    Vous pouvez accéder aux données de cette sous-couche directement à partir de la page de sous-couche sans revenir à la page principale.

  5. Sur le ruban, cliquez sur la flèche de retour en regard de Historic Lakes Historic Lakes (Lacs historiques).

    Retour sur le ruban

  6. Sur le ruban, cliquez sur l’onglet Données.

    La table réapparaît. Elle comprend une nouvelle colonne, nommée Photos and Files (Photos et fichiers).

    Table avec la colonne Photos and Files (Photos et fichiers)

  7. Sur la ligne Lop Nur, dans la colonne Photos and Files (Photos et fichiers), cliquez sur Add (Ajouter).
  8. Dans la fenêtre Photos and Files (Photos et fichiers), dans l’onglet Add (Ajouter), cliquez sur Choose File (Choisir un fichier).

    Bouton Sélectionner un fichier

  9. Accédez au dossier Show_images_in_pop_ups et choisissez le fichier Lop_Nur.jpg que vous avez téléchargé précédemment. Cliquez sur Open (Ouvrir).
  10. Cliquez sur Upload (Charger).
  11. Lorsque le message Upload Successful (Chargement réussi) apparaît, fermez la fenêtre Photos and Files (Photos et fichiers).

    Pour les jeux de données plus volumineux, il est plus facile de gérer une table d’URL que de charger manuellement des fichiers. D’autre part, les pièces jointes sont préférables si vous devez rattacher des fichiers que vous ne souhaitez pas partager avec une URL publique.

  12. Dans la colonne Image source (Source d’image), sur la ligne Lop Nur, saisissez NASA.

    Source d’image Lop Nur (Lop Nur) définie sur NASA dans la table

Configurer les fenêtres contextuelles

Maintenant que les données comprennent des images pour chaque lac, vous allez configurer les fenêtres contextuelles pour afficher les images.

  1. Sur le ruban, cliquez sur l’onglet Visualization (Visualisation).
  2. Sur la carte, effectuez un zoom avant et cliquez sur l’entité Lop Nur sur la Chine occidentale.

    Une fenêtre contextuelle s’affiche, répertoriant les deux champs d’origine et les deux nouveaux champs. Elle affiche également une image.

    Fenêtre contextuelle de l’entité Lop Nur avec une image

    Les pièces jointes sont affichées par défaut dans les fenêtres contextuelles.

  3. Cliquez sur l’entité Aral Sea (Mer d’Aral) à la frontière du Kazakhstan et de l’Ouzbékistan.

    Cette fenêtre contextuelle n’affiche aucune image. À la place, l’attribut Picture (Image) est affiché sous la forme d’un lien, tout comme pour l’attribut Webpage (Page Web).

    Fenêtre contextuelle de l’entité Aral Sea (Mer d’Aral) sans image

    Vous allez configurer la fenêtre contextuelle de façon à afficher l’image.

  4. Dans la fenêtre Contents (Contenu), cliquez sur Layers (Couches).

    La couche Historic Lakes (Lacs historiques) est maintenant sélectionnée.

  5. Dans la barre d’outils Settings (Paramètres), cliquez sur l’onglet Pop-ups (Fenêtres contextuelles).
  6. Dans la fenêtre Pop-ups (Fenêtres contextuelles), cliquez sur Add content (Ajouter du contenu), puis sur Image.
  7. Dans la fenêtre Configure image (Configurer une image), en regard du champ URL, cliquez sur le bouton de champ.

    Bouton Champs

  8. Dans la fenêtre Add Field (Ajouter un champ), faites défiler l’affichage jusqu’au champ Picture (Image).

    Champ Picture (Image) dans la fenêtre Add field (Ajouter un champ)

  9. Cliquez sur Done (Terminé).
  10. Sur la carte, cliquez sur chaque entité de lac et faites défiler l’écran jusqu’au bas de chaque fenêtre contextuelle. Toutes les fenêtres contextuelles affichent à présent une image. L’image de la mer d’Aral est un fichier .gif animé dont l’animation est jouée dans la fenêtre contextuelle.

    Fenêtre contextuelle de l’entité Aral Sea (Mer d’Aral) avec une image

    Si vous le souhaitez, vous pouvez continuer de configurer les fenêtres contextuelles dans la fenêtre Pop-ups (Fenêtres contextuelles). Par exemple, vous pouvez supprimer les champs Picture (Image), Shape_Area (Surface_Forme) et Shape_Length (Surface_Longueur) et arranger le texte Title (Titre). Cette couche montre un exemple de configuration de fenêtre contextuelle complète.

  11. Fermez la fenêtre contextuelle et la fenêtre Pop-ups (Fenêtres contextuelles).
  12. Au-dessus de la carte, sous le ruban, cliquez sur Save (Enregistrer).

    Bouton Enregistrer

    Les paramètres de configuration de fenêtre contextuelle sont à présent enregistrés dans la couche d’entités Historic Lakes (Lacs historiques). Lorsque cette couche est utilisée dans une carte Web, les fenêtres contextuelles sont déjà configurées pour afficher les images.

Dans ce didacticiel, vous avez chargé des données de shapefile dans ArcGIS Online afin de créer une couche d’entités hébergée. Vous avez ajouté deux champs à la couche d’entités et avez modifié ces champs afin d’inclure des URL et du texte de crédit pour des images. Vous avez également activé des pièces jointes et rattaché une image.