Exercise 2: Configure an advanced dashboard

How can I print an exercise to PDF format?

Technical note

Software requirements
· ArcGIS Online

Use the latest version of Google Chrome, Mozilla Firefox, Apple Safari, or Microsoft Edge. Other web browsers may not display your maps and
apps correctly.

For information about supported web browsers for ArcGIS Online, go to ArcGIS Online Help: Supported browsers
(https://links.esri.com/SupportedBrowsers).

Introduction
As you learned in the last exercise, you can easily create a dashboard from scratch, adding elements individually. Another way to create a dashboard
is to make a copy of a dashboard that has already been created. From the copy, you can add, configure, and delete elements as needed. This
functionality not only saves time but also can give you an inside look at the way that the elements were configured.

Scenario
Imagine that you are working for a transportation research company. You have been tasked to create a dashboard displaying flight delay trends for
Minneapolis-St. Paul International Airport. The dashboard will be used internally by the business analysis team to investigate trends and make
recommendations to the airport commission. A colleague had already started to create the dashboard before being transferred to a higher-priority
project.

Rather than recreate the dashboard from scratch, you will save a copy of your colleague's dashboard and configure it for the project. You will add an
element, configure a header with selection elements, and add a splash screen with more information.

Data source
The scenario described in this exercise, although based on real-world data, is fictional and was developed for educational purposes only. The
dashboard is derived from the Flight Delay Analysis - MSP Airport Monthly Review dashboard created by the ArcGIS Dashboards team.

Note: The exercises in this course include View Result links. Click these links to confirm that your
results match what is expected.

Estimated completion time in minutes: 45

Expand all steps Collapse all steps

- Step 1: Copy a dashboard

When a dashboard is created, by default, it can be copied. You can change the settings to not allow copying of the dashboard. In this case, you
know that your colleague has not changed the option to copy the dashboard.

In this step, you will make a copy of your colleague's dashboard and save it.

a Sign in to ArcGIS Online, if necessary, using your course ArcGIS account (username ending in _geoapps).

b At the top of the page, click the Search button , and then type MSP flight delay analysis owner:esritrainingsvc.

c On the left, under Filters, turn off Only Search In <your MOOC organization>.

d For the MSP Flight Delay Analysis dashboard result, in the bottom right, click Open Dashboard.
 Step 1d***: Copy a dashboard.

A dashboard displaying several elements appears. You will copy the item ID of this dashboard to create a new dashboard.

e From the URL, select and copy the item ID at the end, as shown in the following example graphic.

Note: Your URL may be slightly different than what is shown in the example. The example is only
meant to direct you to the part of the URL where the item ID is located.

f Return to the Search tab.

g In the upper right, click the Apps button and choose Dashboards.

From the Dashboards page, you can view dashboards that you have created and those that have been shared with you. You can also create a
new dashboard. You will create a new dashboard using the item ID that you copied.

Step 1g***: Copy a dashboard.

h In the upper right of the ArcGIS Dashboards page, click Create Dashboard.

i In the URL, after the word New, type #id=.

j Next to #id=, paste the item ID of the dashboard that you previously copied, as shown in the following example graphic.

k Press Enter.

The Create New Dashboard page appears. Instead of being empty, as it normally would be for a new dashboard, the information from the
copied dashboard has been added.

l On the Create New Dashboard page, complete the following steps:

1. For Title, type MSP Analysis_<Your Student Name> (for example, MSP Analysis_Student).
 2. For Tags, add Aviation, MSP, ModernGeoApps, and MOOC.
3. For Summary, type Dashboard to analyze flight delays and cancellations at Minneapolis-St. Paul International Airport. For training
purposes only.

m Click Create Dashboard.

Step 1m***: Copy a dashboard.

In this step, you copied a dashboard that your colleague created earlier. The copied dashboard looks exactly like the original, except that now
you can edit it.

- Step 2: Configure advanced formatting

The dashboard contains information about flights arriving to or departing from Minneapolis-St. Paul International Airport (MSP). It has four
indicator elements that display quantitative information about flight status, including the number of flights that were on time, delayed, or
cancelled.

The elements also show the percentage of arriving and departing flights per category. For instance, there were 14,873 on-time flights. Of the
on-time flights, 51.72 percent were arrivals and 42.28 percent were departures.

Some of the flights were diverted to other airports, but that information is not displayed in the dashboard. In this step, you will add an indicator
that shows diverted flights. You will then apply formatting from one of the premade indicators to the new element. The advanced formatting
will apply custom text and styling to the element.

a On the dashboard toolbar, click the View button .

 Step 2a***: Configure advanced formatting.

In the View pane and in the dashboard, you can see four indicators for displaying flight status information, a serial chart showing the number
of flights by airline, a table categorizing the reasons for flight delays, and a map showing air routes to and from Minneapolis-St. Paul
International Airport.

You will add an additional indicator displaying the number of diverted flights. Because you want it to look like the other indicator elements,
you will examine an indicator and copy the formatting to the new one.

b On the dashboard toolbar, click the Add Element button and point to the Flights Cancelled element.

Step 2b***: Configure advanced formatting.

c On the right side of the element, click the Position Indicator button and choose Indicator.

d In the Select A Layer window, under Layers From 'MSP Flight Delay' Map, click Flight_delay_MNDestAirports.
 Step 2d***: Configure advanced formatting.

e Click Done.

Step 2e***: Configure advanced formatting.

You have created a new indicator and selected a layer as its data source. You will now examine the Flights Cancelled indicator and copy the
formatting.

f In the View pane, next to Indicator – Flights Cancelled, click the Options button and choose Configure.

g In the Indicator window, click the Indicator tab and, next to Advanced Formatting, click the Pop Out Editor button .
 Step 2g***: Configure advanced formatting.

Although you do not need to use any code when creating a dashboard, you have the option to apply Arcade formatting expressions. Arcade is
a lightweight expression language used across ArcGIS products and is used to create custom content.

For more information about using Arcade formatting expressions in ArcGIS Dashboards, see ArcGIS Dashboards Help: Use advanced
formatting (https://links.esri.com/DashboardFormat).

For the indicator, your colleague created an Arcade formatting expression that categorizes the percentage of cancelled flights by arrival and
departure. They also included language to style the way that the information is displayed.

The expression accomplishes the following tasks:

· Designates the data points to which the expression will be applied

· Formats the output (departure and arrival cancellations), displayed as percentages
· Creates and applies a style to the output
· Creates a container in the indicator element where the style will be applied
· Formats the entire element
You will copy this expression, paste it into the new indicator, and update the color and text parameters.

h Press Ctrl+A to select the entire script and then Ctrl+C to copy it.

i Click Done.

j Click Cancel to close the configuration window.

k From the View pane, open the Configure options for the new indicator.

l Click the Indicator tab and, next to Advanced Formatting, click Enable.

m Next to Advanced Formatting, click the Pop Out Editor button.

 Step 2m***: Configure advanced
formatting.

The default formatting expression for the indicator is displayed. You will paste over this information with the formatting expression that you
copied from the Flights Cancelled indicator.

n Press Ctrl+A to select the entire expression and then Ctrl+V to paste the new expression.

You will now change the background color and the text at the top of the indicator.

o Under Format Element, next to Background Color, replace ffd087 with the hex code 7d6f70.

p Next to TopText, replace Flights Cancelled with Flights diverted.

Step 2p***: Configure advanced formatting.

q Click Done.

Note: In the preview pane, you may see an Unable To Execute Arcade Script warning. You can
ignore this warning, which should resolve itself when you are done with the configuration.

In this step, you added a new indicator element to the dashboard. You added an Arcade formatting expression, which applied custom text and
styling to the element. By copying a premade dashboard and slightly adjusting an Arcade formatting expression, you created a customized
 indicator element that mirrors the design of the other indicators in the dashboard. You will continue configuring the indicator in the next step.

- Step 3: Configure indicator settings

In this step, you will configure the rest of the indicator settings.

First, you will filter the layer to only display information about flights that were diverted.

a Click the Data tab and, next to Filter, click +Filter.

b Under Filter, complete the following steps:

1. Click Field For The Condition and choose ORIGIN.
2. Click Enter A Value.
3. In the Search Options Or Enter New Value field, type MSP and choose MSP.
4. Click AND.
5. Create an expression where DIVERTED is equal to 1.

Step 3b***: Configure indicator settings.

You will configure general information about the indicator.

c Click the General tab and, under Name, type Indicator – Flights diverted.

You will add dynamic text that will reference the Arcade expression and apply it to the bottom of the element. When applied, it will display the
percentage of arrival and departure flights that were diverted.

d Next to Description, click Edit.

e In the text editor, click the Insert button and choose HTML.
 Step 3e***: Configure indicator settings.

f Next to Description, click Minimize.

You will now update the accessible name that is referenced by screen readers. The name defaults to the type of element. Because you have
multiple indicator elements, you will designate the specific indicator.

g Click the Accessibility tab and, under Accessible Name, type Diverted flights indicator.

You will set the reference value for the indicator. In this element, the reference value is the total number of diverted flights. The statistics
displayed for arrival and departure flights are based on that value. If the indicator shows that seven total flights were diverted, the arrival and
departure flight statistics are based on the reference value of seven diverted flights.

For more information about reference values, see ArcGIS Dashboards Help: Indicator (https://links.esri.com/Indicator).

h Click the Data tab, and then scroll to the bottom of the Data Options pane.

i Turn on Reference.

j Click the Reference subheading to expand it and, next to Filter, click +Filter.

k Create an expression where DEST is equal to MSP and DIVERTED is equal to 1.

 Step 3k***: Configure indicator settings.

l Click Done.

m In the View pane, next to the Indicator row, click the Distribute Width Evenly button.
 Step 3m***: Configure indicator settings.

n Save your dashboard.

In this step, you updated additional indicator settings and filtered the data to display information associated with diverted flights. Your
dashboard is almost done. You will add a few more elements to make it more interactive.

- Step 4: Configure a header

If you were to publish the dashboard now, the business analysis team would see that it displays the status of several thousand flights from an
airport in the United States. However, they would probably have to explore the dashboard to determine its precise purpose. Because the
analysts are working on several projects at the same time, it is important that they can understand the dashboard topic at a glance.

In this step, you will add a header to the dashboard with an explanatory title and a subtitle, so that the purpose of the dashboard is easy to see.

a In the View pane, click the Header tab, and then click Add Header.

b In the Header pane, under Title, type Flight Delay Analysis.

c Under Subtitle, type Minneapolis-St. Paul International Airport (MSP).

d Turn off Header Margin.

e Click Logo and, under Type, click Icon.

f Click Points Of Interest.

g From the first row, choose the airplane icon, and then click OK.
 Step 4g***: Configure a header.

h Click Done.

Step 4h***: Configure a header.

The header appears at the top of the dashboard.

i Save your dashboard.

In this step, you added a header containing a title and subtitle. The header specifies that this dashboard is for analysis of flight delays at the
Minneapolis-St. Paul International Airport. With these updates, when a business analyst opens the dashboard, the analyst will understand that
the data that they see pertains to that particular airport.

- Step 5: Configure a category selector

You want business analysts to be able to filter information on the entire dashboard so that they can view information for specific airlines. You
can add a selector to the dashboard to fulfill this requirement. A selector is an element that triggers an action when something is selected. You
can add a selector to a header, sidebar, and a mobile view drawer.

In this step, you will add a category selector element to the header. You will configure the element so that, when you select one or more
airlines, data in the dashboard will filter to satisfy the specified criteria.

For example, if you select DL (Delta Airlines), dashboard elements will only display flight information associated with Delta Airlines.

For more information about selectors, see ArcGIS Dashboards Help: Use selectors (https://links.esri.com/Selectors).

a In the Header pane, click + Add Selector and choose Category Selector.

b In the Category Selector pane, under Categories From, click Grouped Values.

By choosing Group Values, categories will be generated based on the field that you designate. In this case, the field that you are designating
contains airline codes.

c Under Layers From 'MSP Flight Delay' Map, choose Flight_delay_MNDestAirports.

d Under Category Field, click ORIGIN_CITY_NAME and choose OP_UNIQUE_CARRIER.

 Step 5d***: Configure a category selector.

e Click the Selector tab and, under Selection, click Multiple.

Setting the selection to Multiple will allow you to select more than one airline.

f Under Label, type Airlines.

g Under Placeholder Text, type Select an airline to filter.

Step 5g***: Configure a category selector.

h Click the Actions tab and, under When Selection Changes, click Filter.

i Under Filter, turn on all elements except for the following layers in the Map element:

· Flight_delay_destAirports_MSP_OriginDestinationLinks
· Flight_delay_MNoriginAirports
j Under Map - Flight Delay and the US States Flights From MN layer, click Spatial.

Step 5j***: Configure a category selector.

When you select the Spatial method, features on the map that meet the filter criteria will display.

k Click Done.

Step 5k***: Configure a category selector.

l Save your dashboard.

You have configured the selector so that, when you designate one or more airlines, the data in the indicator, serial chart, table, and map
elements will display data corresponding to the selected airline or airlines. You will add one more selector, then test both indicators.

- Step 6: Configure a date selector

You can add more than one selector element and use them in combination to apply multiple filter criteria to the dashboard.

In this step, you will add a date selector element to the header. You will configure the element so that, when you select a date, the dashboard
elements will display only information that is associated with that date.

a In the View pane, under Header, click +Add Selector and choose Date Selector.

b In the Date Selector pane, under Label, type Flight date.

c Under Type, click Date Picker.

With the Date Picker option, you can select a single date.

d Turn on Show Reset And Today.

 Step 6d***: Configure a date selector.

This option allows you to reset the selector to show all dates or to only show information for the current date.

e Click the Actions tab and, under When Selection Changes, click Filter.

f Under Indicator - Flights Cancelled, turn on Reference.

g Under Target Field, choose FLIGHT_DATE.

h Turn on Value.

i Under Target Field, choose FLIGHT_DATE.

 Step 6i***: Configure a date selector.

j Repeat the process to turn on and choose a Target Field for the following elements:
· Indicator – Flights Delayed
· Indicator – Flights Diverted
· Indicator – On-Time Flights
· Indicator – Total Flights
· Serial Chart – Flights
· Table – Delay Reason
k Click Done.

l Save your dashboard.

In this step, you added and configured a data selector element so that you can view flight information by date.

- Step 7: Test the selectors

Now that you have added and configured both selector elements, you will test the elements.

a On the header, click the category selector element (Airlines) and check the AA box.

b Click the date selector element (Flight Date) and, for MM/dd/yyyy, type 11/05/2023.

c Click away from the pop-up to close it.

 Step 7c***: Test the selectors.

The dashboard updates to show flight data for American Airlines on 5 November, 2023, at Minneapolis-St. Paul International Airport.

d Open the date selector again and click Reset.

e Open the category selector element again and uncheck the AA box.

In this step, you tested the category selector and the date selector to see how the selection affects the displayed data in the dashboard.

- Step 8: Configure a splash screen

You want to include a point of contact with the dashboard in case an analyst has questions about the content. You want the contact information
to be visible, but you do not think that it is necessary to include it in the dashboard layout. In this case, you can add a splash screen, which
displays information when the dashboard is first opened and can then be dismissed.

In this step, you will add a splash screen directing users to a point of contact in the organization.

a From the View pane, click the Settings tab and, next to Splash Screen, click Add.

b Click Body to expand the section and type For questions about this dashboard, please contact the Aviation Analysis team.

c Expand General, and then turn on Allow Permanent Dismiss.

With this option, you can check a box to avoid launching the splash screen the next time that the dashboard opens.

d Under Dismiss Button Label, click OK.

e Click Done.

f Save your dashboard.

You will now open the dashboard outside of edit mode to view the splash screen.

g From the browser, copy the dashboard URL.

h Open another tab and paste the URL.

i At the end of the URL, delete #mode=edit, as highlighted in the following graphic.
 Note: Your URL will look different than the one in the example.

j Press Enter.

Step 8j***: Configure a splash screen.

The splash screen appears on the dashboard.

k On the splash screen, click OK.

Note: If the text in the elements appears to not fit, refresh the browser.

l Close the tab with the open dashboard and return to the editable dashboard.

In this step, you configured a splash screen that will direct business analysts to the Aviation Analysis team if they have questions. Next, you will
share the dashboard so that the analysts can access it.

- Step 9: Share the dashboard

Now that you have finished configuring your dashboard, you will share it.

a In the upper left of the dashboard, click the Menu button and choose Content.

b Under My Content, locate your dashboard and click the Shared Owner button .

c In the Share window, under Set Sharing Level, click Everyone (public).
 Step 9c***: Share the dashboard.

d Click Save.

In this exercise, you copied a dashboard that your colleague had created. You added an indicator element and adjusted an Arcade formatting
expression that customized the indicator. You also added a header with a title and selection elements, which can be used to filter data in the
entire dashboard. Finally, you added a splash screen with additional information about the dashboard.

Now that you have updated the sharing levels, you can share the dashboard URL with the business analysts so that they can start analyzing the
flight delay data.
Copyright © Esri
All rights reserved.

Published in the United States of America.

The information contained in this document is the exclusive property of Esri. This work is protected under United States copyright law and other
international copyright treaties and conventions. No part of this work may be reproduced or transmitted in any form or by any means, electronic or
mechanical, including photocopying and recording, or by any information storage or retrieval system, except as expressly permitted in writing by Esri.
All requests should be sent to Attention: Director, Contracts and Legal, Esri, 380 New York Street, Redlands, CA 92373-8100, USA.

Export Notice: Use of these Materials is subject to U.S. export control laws and regulations including the U.S. Department of Commerce Export
Administration Regulations (EAR). Diversion of these Materials contrary to U.S. law is prohibited.

The information contained in this document is subject to change without notice.

Commercial Training Course Agreement Terms: The Training Course and any software, documentation, course materials or data delivered with the
Training Course is subject to the terms of the Master Agreement for Products and Services, which is available at
https://www.esri.com/~/media/Files/Pdfs/legal/pdfs/ma-full/ma-full.pdf. The license rights in the Master Agreement strictly govern Licensee's use,
reproduction, or disclosure of the software, documentation, course materials and data. Training Course students may use the course materials for
their personal use and may not copy or redistribute for any purpose. Contractor/Manufacturer is Esri, 380 New York Street, Redlands, CA 92373-
8100, USA.

Esri Marks: Esri marks and product names mentioned herein are subject to the terms of use found at the following website:
https://www.esri.com/content/dam/esrisites/en-us/media/legal/copyrights-and-trademarks/esri-product-naming-guide.pdf.

Other companies and products or services mentioned herein may be trademarks, service marks, or registered marks of their respective mark owners.