In this tutorial, we'll demonstrate how to create a simple daily monitoring dashboard that can be used to provide an individual summary of an athlete's wellness and training log data.
We'll create data filters using select box and date picker widgets, and display the data using tile, table and time series chart widgets. We'll also show you to how conditionally format a tile using a ruleset.
If configured as per the instructions in this tutorial, data will only ever be shown for one user at a time because all of the data widgets will be filtered to match the selected athlete.
To build the athlete daily monitoring dashboard, work through each of the steps below:
- Create a new dashboard.
- Add an additional data source.
- Create filtering widgets.
- Create a section.
- Create a tile.
- Add filters to data widgets.
- Create a table.
- Create a time series chart.
- Create a ruleset to conditionally format tiles and table cells.
- Publish and test the dashboard.
Step 1: Create a new dashboard
Related help article: Create a New Dashboard
- Select the Dashboard builder tool from the builder interface.
- Select Create new Dashboard Builder. This will bring up the new dashboard screen.
- Enter a name for the dashboard.
- Select a category for the dashboard from the drop-down menu, or type a new category name into the Dashboard category field and press the Enter key.
- Choose which event form will be used as your initial data source. In this example, we’ve selected the Daily Diary event form.
- Select Create dashboard.
Step 2: Add an additional data source
Related help article: Manage Data Sources in a Dashboard
- Select Data Sources in the header bar.
- Select the + icon in the left sidebar.
- In the pop-up window, select the event form to add as a data source. In this example, we’ve selected the Training Log event form.
- (Optional) Rename the data source, adjust the time period of the data source and limit how many records are included in the dashboard.
Step 3: Create filtering widgets
Filtering widgets filter the data displayed in other widgets, such as tiles, tables and charts.
After adding a select box or date picker widget to a dashboard, you also must add a filter to any widgets that should show data based on the filter values.
Create an athlete filter
Related help article: Select Box Widget
- Select the Add widget button from your dashboard workspace.
- Choose Select box.
- In the General settings, enter a name for the widget in the Title (e.g. “Athlete”) and optionally configure any other formatting preferences.
- In the Options settings:
- Set the Option data type to String.
- Select the data source to pull the list of names from as the data source for options.
Use a data source with a record for every user.
- Set the Field to About.
Create a date filter
Related help article: Date Picker Widget
- Select the Add widget button from your dashboard workspace.
- Choose Date picker.
- In the General settings, enter a name for the widget in the Title (e.g. “Date today”) and optionally configure any other formatting preferences.
- In the Date Range settings, set the Date range to No range.
- In the Default Date settings, set the Default date to Today.
To filter widgets so they show data within a range (e.g. between 1/1/2024 and 31/1/2024), create a second date picker widget:
- Create a second date picker widget by adding a new widget or duplicating the existing date picker widget.
- In the General settings, enter a name for the widget in the Title (e.g. “Show data from”) and optionally configure any other formatting preferences.
- In the Date Range settings, set the Date range to No range.
- In the Default Date settings, set the Default date to Past date relative to today and enter 2 weeks.
- Close the filter window.
Step 4: Create a section
Related help article: Dashboard Sections
- Select the Add Section button in the dashboard workspace.
- Use the arrow icons in the section toolbar to move the section elsewhere on the canvas.
- Select the section header bar.
- In the General settings, enter a name for the section in the Title.
- (Optional) Configure any other formatting preferences for the section, including setting an icon and changing colors.
Step 5: Create a tile
Related help article: Tile Widget
- Select the Add Widget button in the section where you want to add the widget. If necessary, you can move it with the widget toolbar settings later.
- Choose Tile.
- Create a widget to show the most recent availability status for the athlete in the select box up to the date selected in the date picker widget.
- In the General settings, enter a name for the widget in the Title (e.g. “Availability”) and optionally configure any other formatting preferences.
- In the Data settings, select the Daily Diary data source.
- In the Value settings:
- Set the Field to Availability.
- Set the Data type to String.
- Set the Aggregation to Get from most recent record.
Step 6: Add filters to data widgets
Related help article: Filter a Dashboard Widget
- Select the widget you want to filter (i.e. tile, table or time series chart).
The filter settings for tile widgets are in the Value settings, while the filter settings for table and time series chart widgets are in the individual Column and Series settings. - Select the Edit Filters button.
- To filter widgets so they show only data for the select athlete:
- Select Add Filter.
- Set the Filtered field to About.
- In the Condition dropdown, type is equal to in the search bar. Select the option that appears under “String”, to match the data type of the select box widget.
- Set the Filtering widget/value to the select box you created earlier.
- To filter widgets so they only show date entered prior to or on a selected date:
- Select Add Filter.
- Set the Filtered field to Date.
- In the Condition dropdown, select is before or same from the list.
- Set the Filtering widget/value to the first date picker you created (i.e. "Date today"), where the default date is today.
- To filter widgets so they show data within a range (e.g. between 1/1/2024 and 31/1/2024), create a second date filter:
- Select Add Filter.
- Set the Filtered field to Date.
- In the Condition dropdown, select is before or same from the list.
- Set the Filtering widget/value to the second date picker you created (i.e. "Show data from"), where the default date is 2 weeks ago.
- Close the data filters window.
Step 6: Create a table
Configure the widget to show summary fields from all Training Log records up to the date selected in the date picker widget for the athlete in the select box.
Related help article: Table Widget
- Select the Add Widget button in the section where you want to add the widget. If necessary, you can move it with the widget toolbar settings later.
- Choose Table.
- In the General settings, enter a name for the widget in the Title (e.g. “Availability”) and optionally configure any other formatting preferences.
- In the Data settings:
- Select the Training Log data source.
- Add data filters for the athlete (select box) and date (date picker).
- In the Column settings, select Add Column. Select the column to view the settings.
- Enter a name for the column in the Column title.
- Select the Date field as the Data field.
- Set the Date type to match the data field selected above. In this case, set the data type to Date.
- Repeat the steps above to add additional columns (e.g. athlete’s name, training modality, workload).
Step 7: Create a time series chart
Configure the widget to show the total workload for each day, up to the date selected in the date picker for the athlete in the select box.
Related help article: Time Series Chart Widget
- Select the Add Widget button in the section where you want to add the widget. You can move it with the widget toolbar settings later if required.
- Choose Time series chart.
- In the General settings, enter a name for the widget in the Title. Optionally configure any other formatting preferences.
- In the Series settings, select the series to view the settings:
- Enter a Series name. This will appear in the legend and when users hover over data points.
- Select the Training Log data source.
- Set the Field as the Workload field.
- Leave the Time field set to Date.
- Add data filters for the athlete (select box) and dates (date pickers).
- Set the Aggregation to Sum.
- (Optional) Go to the Advanced tab to change the number of decimal places and other advanced settings.
- Create a second series by repeating the steps above or selecting the Duplicate icon.
- Configure the second series to show the Total Wellness Score from the most recent Daily Diary record.
- In the Advanced tab for the series, select Plot on Y2 axis.
- In the Y-Axis settings, enter an axis label for the data being shown (i.e. “Total Workload”). Optionally adjust the decimal places, minimum and maximum axis values.
- In the Y2-Axis settings, select Show Y2 axis to reveal the axis settings. Enter an axis label for the data being shown on the second series (e.g. “Total Wellness”). Optionally adjust the decimal places and minimum and maximum axis values.
Step 8: Create a ruleset to conditionally format tiles and table cells
Related help article: Rulesets and Conditional Formatting in Dashboards
- Select Rulesets in the header bar.
- Select Create ruleset.
- Select NEW RULESET and replace it with a new ruleset name (e.g. “Availability”).
- Set the Data type to String.
- Select the + icon next to Create rule.
- Set the condition to is equal to.
- Type the availability status name into the text field exactly as it appears in the event form.
- Select a color for the status. This will determine the color of the tile or table cell.
- Select the + icon next to Create rule, or duplicate the existing rule, and repeat the step above to create a rule for each availability status.
- When complete, return to Dashboard in the header bar.
- Select the tile widget that you want to conditionally format.
- In the Conditional Formatting settings, enable conditional formatting. This will reveal additional settings.
- Set the Conditional field to the Availability field selected in the Value settings.
- Set the Conditional formatting ruleset to your newly created availability ruleset.
- (Optional) Select Use legible foreground color.
Step 9: Publish and test the dashboard
Related help article: Save and View a Dashboard
- Select Publish in the header bar.
- Load the main AMS site.
- Ensure there are sample data records entered for the event forms used as data sources.
- Open the dashboard.
- Change the values in the select box and date picker widgets and check that the data shown in the tile, table and time series chart widgets changes.