Image widget

The Image widget allows you to add static and dynamic images to a page.

Examples

Use this widget to support app design requirements such as the following:

  • You want to add supporting images to a page that visualizes or corresponds with the represented topics or data.
  • You want to show an image on the home page that end users can click to be redirected to another website.

Usage notes

For a static image source, there are no limitations for the size of the images or the number of images you can upload. Only images that have been connected to an element in your app are stored in the web experience ArcGIS item. Images that have been uploaded but not used are cleared when you refresh the browser. It's best to upload images only as you need them. The images you upload are stored during your browser session to avoid adding the same image for different widgets multiple times.

Settings

The Image widget includes the following settings:

  • Connect to data—Optionally connect the widget to specific data, including a data view. (A data source is not required for an Image widget.)

    Note

    If you connect to a data source, you can still add a static image, but you can also set a dynamic source from the attributes or expressions based on the data source.

  • Image source—Select an image source by either uploading it from local files or providing the URL. If applicable to the selected data, click Dynamic and choose Attachment or Symbol to populate the image widget with feature layer attachments or web map feature symbols.

    • If the selected data view contains multiple features, the image widget only displays the attachments or symbols for the first feature.
    • Attachment and Symbol source support data view selection, Selected features, or Auto-populated features (with List).
  • Set link— Add a link to the image so it opens a page, window, or a view in a section in your app or opens an external web address. You can choose whether the link opens in the same window as the app, the top window, or a new window.

  • Tooltip—Provide hover text to describe the image.

    Note

    For ToolTip and alt text input, if a data source is connected, you can either directly type the content (static) or choose dynamic content using attributes, statistics, or expressions based on the data source.

  • Alt text—Provide the alt text for assistive technology, such as screen readers.

  • Position

    • Fill—Fill the widget area with the image leaving no blank space but the image may be cropped.
    • Fit—Fit the entire image within the widget borders.
  • Shape—Change the image shape from rectangular to other options such as circular and hexagonal.