Infographic widget

The Infographic widget provides eight graphic templates you can use to visualize and monitor attributes and statistical data in the map and from the extra data sources.

The visualization graph generated by the Infographic widget is dynamic, refreshing when the map extent or data source changes, and can be interactive with the map. The targets and corresponding indicators for the data are supported in certain templates.

Two data sources are available when you configure the Infographic widget—Map and Extra data source:

  • When Map is chosen as data source, only feature layers with query capabilities are supported, and the refresh interval for layers can be set on the Map tab.
    Note:

    A feature layer is a single layer that can be created from a map service or feature service, from ArcGIS Online or ArcGIS Enterprise items, or from an array of client-side graphics. As a result, a feature layer can be added from the following sources:

    • An ArcGIS Server service URL from a feature service
    • An ArcGIS Server service URL from a sublayer of map service
      Caution:

      The layer added from a map service as a group is available from Extra data source but not from the Map data source.

    • Hosted feature service
    • Feature collection

  • When Extra data source is chosen, you can add the Layer and Statistics type from the extra data source under the Attribute tab, or use the resultant output layer from other widgets in the app. When data is added as Layer, it could be a feature layer, table, or an image service vector layer. When data is added as Statistics, it stores the feature count of group data (if specified) and performs server-side calculation on the sum, average, maximum, and minimum values of the group (if specified) based on one or more numeric fields.
    Note:

    Currently, the Infographic widget only takes into account the results of the Query and Geoprocessing widgets.

There are some limitations regarding the Map data source. With the Map data source, features on the map may be loaded by snapshot or on-demand mode. When features are loaded by on-demand mode, they are filtered by the current map extent, so you can't turn off the Filter by extent option in the configuration. In fact, all the services by default use on-demand mode except the hosted feature service. For the point hosted feature, when the number of features is less than or equal to 4,000, snapshot mode is enabled; when greater than 4,000, on-demand mode is enabled. For the polyline and polygon hosted feature, the threshold is 2,000 features with 250,000 vertices.

However, the above limitation does not exist when the data is added from Extra data source. You can control the Filter by extent option.

The eight templates are provided so you can visualize field values, field statistics results, or feature counts. See the following table for details:

Template nameDisplay valueSupport custom indicators

Number

  • Feature count
  • Field statistics

Yes

Gauge

  • Feature count
  • Field statistics

Yes

Vertical Gauge

  • Feature count
  • Field statistics

Yes

Horizontal Gauge

  • Feature count
  • Field statistics

Yes

Pie Chart

  • Field values
  • Categorized statistics
  • Categorized feature counts
  • Field statistics

No

Column Chart

  • Field values
  • Categorized statistics
  • Categorized feature counts
  • Field statistics

No

Bar Chart

  • Field values
  • Categorized statistics
  • Categorized feature counts
  • Field statistics

No

Line Chart

  • Field values
  • Categorized statistics
  • Categorized feature counts
  • Field statistics

No

Configure the Infographic widget

The Infographic widget can be set to open automatically when an app starts. To enable this feature, click the yellow dot on the widget, which turns it dark green.

The following steps show how to configure a graph with the Number template. The settings of three gauge-related templates are similar to the Number template.

For the settings of four chart templates—Pie, Column, Bar, and Line charts—see Chart widget. Compared to the Chart widget, the chart templates are enhanced with the following features:

  • Use the layer's symbol as chart color when applicable.
    Note:

    The Use layer's symbol option is on the Display tab. Whether or not the option is available depends on the type of layer renderer in the map and the display mode you choose on the Data tab. For example, when the layer is rendered by unique values without a symbol, and Display values feature by feature is chosen, you have the option to use the layer's symbol color as the chart color.

  • When the date field is chosen as Category field in display mode, parse the minimum period into one of selected units, including year, month, day, hour, minute, and second.
  • Sort the chart by the value or label.
  • Set the maximum categories for performance.
  • Use the extra data source.
  • Set a modern look and feel.

  1. Hover over the Infographic widget and click the edit button Edit.

    The configuration window for the widget and the template choosing panel appear.

  2. Click the thumbnail of the Number template, and click OK.
  3. Choose the data source.

    This can be a feature layer in the map, an output layer of the widget, or an extra data source added on the Attribute tab.

  4. Click OK and enter the setting panel of the template.
  5. Click the Change widget button to replace the default icon for this widget with your own image.

    A file explorer window appears allowing you to browse to a local image file to use as the widget icon.

  6. Set interact conditions if the data source is a feature layer from the current map.
    • Use selection—Only use selected features to create the graph. If there is no selection in the source layer, the entire dataset will be used.
    • Filter by extent—Only use features in the current map extent to create the graph.
      • If the data source is a feature layer from the map and is loaded in on-demand mode, the Filter by extent option is checked and can't be turned off.
      • If the data source is a feature layer from the map and is loaded in snapshot mode, the Filter by extent option can be turned on and off.
      Note:

      If a layer is added from Map in the extra data source, the Filter by extent option can be turned on when you click the Set button under Filter in the Configure data source window and check Only the features within the current map extent under Extent in the Data source filter window. However, once Filter by extent is on, it can't be turned off unless Only the features within the current map extent is unchecked.

  7. Modify an element's layout.

    The left panel is not only a preview of the graph but also a flexible layout editor.

    1. The title, description, image, and number are elements that can be added to the template. Click an element thumbnail to hide or show the corresponding element.

      Element thumbnails

    2. Click an element in the preview to highlight it, and drag the upper and lower borders to resize it. Drag the handle in the upper right corner to rearrange it.

      Rearrange handle

    3. Click the Reset Reset to reset the layouts.
    4. Click Change Template to choose a different template, such as Gauge.

      Caution:

      This will delete all the existing settings and open a new, blank template.

  8. Click each element to set its parameters.

    All changes take effect in the preview synchronously.

    1. Under Text settings, set the content, font, text size, text color, alignment, and link for the text. Optionally customize the background color of the element.
    2. Under Image settings, set the image source, alignment, and link. Optionally customize the background color of the element.
    3. Under Number settings, set the options on the Data, Display, and Indicators tabs.

      • Data—Set the data format of the result number to either Feature count or Field statistics.

        Data format

      • Display—Set the number’s unit, decimal places, prefix, and suffix. You can also customize the common text parameters (font, text size, text color, and alignment) and background color of the element.

        Number units

        Tip:

        The value displayed in the Gauge template can be not only the number of a feature count or field statistics, but also the proportion of that number in the provided data range.

      • Indicators—Set the target values and corresponding indicators. There are two optional indicators: the color of the value and the indicator icon. If the target value meets the conditions, the element’s color and icon, if set, will change accordingly.

        Add indicator

        Caution:

        The indicators are executed in top-down order. The final appearance is determined by the last condition that data meets.

        Tip:

        The Gauge template also supports ratio targets. This means the target is the percentage given the data range.

  9. Click OK to finish the configuration.

Use the Infographic widget

Activate the Infographic widget in the app by clicking the widget icon.

Activate Infographic widget

  • If the Use selection option was checked during configuration, the number changes when features from the source layer are selected.
  • If the Filter by extent option was checked during configuration, the number changes when the map is panned or zoomed.
  • If indicators were set during configuration, the color and icon change with the number.
  • The graph is updated when the data is refreshed.

Note:

You can also do the following with the chart templates:

  • Hover over individual pieces in the chart. The category and field values display, and the corresponding feature is highlighted on the map.
  • Click the Settings button Settings to turn the legend, data labels, and axis on or off.