ArcGIS Dashboards

Create your first dashboard using ArcGIS Dashboards

ArcGIS Dashboards enables users to convey information by presenting location-based analytics using intuitive and interactive data visualizations. A dashboard is a view of geographic information and data that allows you to monitor events, make decisions, inform others, and see trends. Dashboards are designed to display multiple visualizations that work together on a single screen. They offer a comprehensive view of your data and provide key insights for at-a-glance decision-making.

For more information, see Introduction to dashboards.

 

About this tutorial

In this tutorial you will create a simple dashboard using ArcGIS Dashboards. The dashboard uses a map of medical facilities in Los Angeles County (sample data only) and includes interactive chart and list elements.

You can view the completed dashboard and follow along by using the Los Angeles Health Facilities web map.

Tutorial dashboard
View the dashboard

A dashboard is composed of several elements that work together. Each element is unique and has its own unique configuration settings. For more information, see Dashboard layouts.

The dashboard will include four elements; a map, serial chart, list, and header. The map will be configured to interact with the chart and list, and the list will be configured to interact with the map.

Follow the steps below to create the dashboard and configure its elements.

 

Create a dashboard

A map is often the centerpiece of a dashboard. Best practices are important for the dashboard experience. Apply basic map craft such as configuring effective pop-ups, using scale dependencies, and more. For details, see Create web maps for dashboards.

Step 1 – Open the sample map item page and sign in to your account.

Sign in

Step 2 – Click Create Web App then choose Dashboards.

Create Web App

Step 3 – Enter the required information.

Add a title (a), optional tags (b), and optional summary (c). Click Create dashboard (d) when finished.

Create new dashboard

The dashboard will open after you click Create dashboard. You have created a new dashboard with a single map element. As you continue crafting your dashboard, the Save button at the bottom of the layout panel will display a blue dot as a reminder to save. It’s always a good idea to save your work as you make changes.

Save

Next, you will configure the map and add serial chart, list, and header elements.

 

Configure the map element

Maps play a central role in many dashboards. Not only are they often the most effective way to display your geographic information, but their operational layers can also be used by other data visualizations in the dashboard to create interesting, intuitive, and compelling information elements.

In this section you will:

Step 1 – Configure the map element.

Point to the upper left corner of the map to display a blue bar with three dots. Move your mouse over the bar to reveal the menu. You can access all of an element’s settings via this menu. Click the Configure button.

Configure

Step 2 – On the Settings tab, choose which tools to display in the map. The sample map has configured pop-ups, bookmarks, and a legend, so those tools will be enabled.

In the settings shown below, use the slider to enable (a) pop-ups, (b) default extent and bookmarks, (c) legend, and (d) zoom tools.

Map element options

Click Done in the lower right when finished. A zoom in/out button will display in the lower right of the map element, the upper right of the map element will display a bookmark and legend button.

Legend

 

Add a serial chart element

A serial chart element visualizes one or more series of data points along a horizontal (x) axis and a vertical (y) axis.

In this section you will:

Step 1 – From the dashboard toolbar, click Add element.

Add element

Step 2 – Click the Add element button at the location where you want to add your element. In this example, the left side was chosen. Choose the serial chart element from the drop-down list.

Add a serial chart element

Step 3 – Choose the layer the serial chart will use for the data.

There is only one layer in the map: Click Los Angeles Health Care Facilities.

Select layer

Step 4 – This opens the configuration pane. You will see a series of tabs along the left side. Click the Data tab on the left and set the data options.

(a) – Set the Categories from to Grouped Values.

(b) – Choose TYPE from the Category field from the field dropdown list.

This will group all values of the TYPE attribute in the serial chart segments. Type is also the field by which the health care facilities are symbolized.

Serial chart element data settings

Step 5 – Click the Value axis tab to set the chart axis options. The chart will display the count of various health care facilities, so the value axis will be set for best display results.

(a) – Set the Minimum value to 1.

(b) – Set the axis values to display Integers only.

(c) – Enable label Visibility.

Serial chart elemetn value axis settings

Step 6– Click the Series tab to set the series options. In the Bar Colors section click By Category to display the current bar colors.

Set the bar colors to match the symbols in the web map layer.

The legend for the Los Angeles Health Care Facilities map is shown below.

Legend

Change the color for each series column to match the color of the hospital facility symbols. Click the down arrow to use the color picker, or enter the hex color code for each symbol. The hex color codes are as follows:

Serial chart element series options
View larger image

Step 7 – Click the General tab to set the general options.

Click Edit in the Title options.

Edit serial chart title

(a) – Add a Title.

(b) – Since the health care facilities shown in the map are static, we don’t need to display the last update text. If the layer is updated regularly, Last update text should be enabled to display when the layer was last updated.

Serial chart element general options

Step 8 – Click Done in the lower right when finished.

Step 9 – Configure the map to trigger a chart update whenever the map extent changes.

Open the map configuration options by hovering in the upper left corner of the map element to reveal the menu. Click Configure.

Configure

(a) – Open the Map actions tab.

(b) – In Filter, toggle the serial chart just configured as the target.

Map actions

Click Done when you finish, then Save your work.

Now that the map action has been created, when you pan and zoom the map or use the bookmarks, the series chart is updated to show the counts of each facility type. Hover over the chart bars to view the counts of each facility type.

Facility by type

Optionally, you can show the counts automatically by toggling the Labels on in the Series options of the chart.

Series options of serial chart element

 

Add a list element

A list element is used to show features or rows from a layer and can contain information from any field.

In this section you will:

Step 1 – From the dashboard toolbar, click Add element.

Add element

Step 2 – Click the Add element button (+) at the location where you want to add your element. In this example, the list element will be added at the bottom of the chart element. Choose the list element from the drop-down list.

Add list element

Step 3 – Choose the layer the list element will use for the data.

There is only one layer in the map: Click Los Angeles Health Care Facilities.

Select layer

Step 4 – This opens the list configuration pane. In the Data options tab open the Sort by drop-down list. Choose ALIAS from the drop-down list.

List element data options

Step 5 – Ensure that Ascending as the sort order. This is the default.

This will use the alphabetical ordering from the ALIAS field to sort the displayed list.

Sort ascending

Step 6 – In the List tab, find the Line item template section. Click the field list button and choose ALIAS and CATEGORY from the dropdown field list, arranging them so they are stacked and removing any other fields if shown.

List element list options

Step 7 – Click the Actions tab, click Flash and toggle Los Angeles Health Care Facilities on. This sets the layer as the target for the action.

Also click Show pop-up, selecting the Los Angeles Health Care facilities as the target.

Configure list element actions

Step 8 – Click Done when finished.

This will highlight the feature on the map when it is clicked in the list and display its pop-up.

Step 9 – Configure the map to update the list whenever the map extent changes.

Open the map element configuration options by pointing to the upper left corner of the map element and choosing Configure.

Configure

(a) – Click the Map actions tab.

(b) – Toggle the List element on.

Map actions

Step 9 – Click Done when finished.

After completing these steps, the list will update as the map is panned or zoomed. When you click a facility in the list, the feature will be highlighted on the map and its pop-up will open.

 

Arrange the dashboard elements

Your dashboard now shows the series element above the list element, with the map element on the right. You can re-arrange the elements at any time.

To arrange the elements, point to the upper left corner and click and hold the Drag item button.

Drag item

Drag the element over another to reveal the docking targets, then release on the desired placement.

Docking targets

Hover over the space between dashboard elements and click and hold, dragging the vertical or horizontal bar to the desired size. Note that the size is relative and will change with the overall size of the dashboard. Save your work when finished.

Size elements

 

Add a header element

In this section you will add a header to complete your dashboard. A header element is a reserved area along the top of your dashboard that you can use to give your dashboard a title, apply corporate branding standards, and provide links to additional content.

Step 1 – From the dashboard toolbar, click Add element.

Add element

Step 2 – Click the Add element button (+) at the top center of your dashboard. Choose the Header element from the drop-down list.

Add header element

Step 3 – In the Appearance pane, you can change the title, add a subtitle, and make other changes as desired.

By default, the title that appears on the header panel is the title of the dashboard. Enter a title for your dashboard and make any other changes you like, such as changing the text color or background color.

When finished, click Done and save your dashboard.

 

Start with an existing dashboard

You don’t have to start from scratch every time you build a dashboard. If you find one you like and are wondering how it was created, you can open the dashboard in edit mode (if the author has allowed it) and view how it has been configured. You can use your own maps and data, using the existing dashboard as a template.

See How did they make that dashboard for more information.

 

Best practices

It’s a best practice to complete the item pages for your new Dashboards item. The dashboard created in this tutorial is suitable for general use cases. However, if you expect your dashboard will be in very high demand, see Building highly scalable dashboards to learn about additional implementation practices to ensure it scales effectively to handle high-demand situations.

 

More information

For more information see:

This blog article was originally published on April 20, 2020, and has been updated.

About the author

Corporate technology evangelist and advocate at Esri, focusing on ways to broaden access to geographic information and helping customers succeed with the ArcGIS system. On a good day I'm making a map, on a great day I'm on one. Email bszukalski@esri.com or connect on LinkedIn (https://www.linkedin.com/in/bernszukalski/).

Connect:

Next Article

Dev Summit 2024: Observability and reliability in ArcGIS Enterprise on Kubernetes

Read this article